Lucide と Heroicons
Heroicons は Tailwind のセットで、アウトラインとソリッドのサイズがあります。Lucide は 24px の線に揃えています。
- Tailwind UI には Heroicons。名前に 16、20、24 のサイズがあります。
- 一つのアウトラインに揃えたいコンポーネント集には Lucide。
- Heroicons のソリッドは塗り、Lucide は線です。同じボタングループには置かないでください。
どちらを開くか
すでに Tailwind で、Tailwind UI が想定するアウトラインかソリッドが要るなら Heroicons を開きます。名前に 16、20、24 などのサイズがあるので、コンポーネントに合うサイズを選んでください。一つのアウトラインと 24px のグリッドを想定するコンポーネント集なら Lucide を開きます。Lucide は Feather 系の描き方で、このカタログに Feather 本体は入れていません。
Heroicons は Tabler より少なく、厳選されています。マーケティングページには向き、密な管理画面には足りないことがあります。Tailwind 前提なら Heroicons、shadcn/ui や一つの線なら Lucide が勝つことが多いです。上のカードから各コレクションへ進めます。
アウトライン、ソリッド、グリッド
Heroicons のアウトラインは線、ソリッドは塗りです。このカタログの Lucide は一つのグリッド上の線です。Lucide のボタングループにソリッドを置くと、塗りと描き方が変わります。一つの viewBox を拡縮するより、名前に入っているサイズを選んでください。
どちらもブランドや国旗のセットではありません。それらは SVG Logos、Simple Icons、または国旗のパックに残してください。線の Lucide と塗りの Heroicons を同じ操作の列に混ぜないでください。
Lucide と Heroicons の選び方
Tailwind のマーケページ、名前付きの小さいサイズ、Tailwind UI 内のアウトラインとソリッドの対なら Heroicons です。枠、設定、空の状態を一つの線の太さに揃えるなら Lucide です。すでに Lucide や shadcn のアイコンを貼っているリポジトリも Lucide に揃えます。
ライセンス
Lucide は ISC、Heroicons は MIT です。使う方の表記を残してください。どちらも CC BY ではないので、ページ上のクレジット行はこれらのセットが求めるものではありません。SPDX の表は ライセンス を見てください。上流のライセンスに従ってください。このサイトは法的な助言ではありません。