テック技報最新号へ →
デザイン

アイコンはLucideだけにしない：Phosphor・Iconoir・Tabler・Solar・Hugeicons、Material Symbolsなどから選ぶ

AI生成のUIはLucideアイコンが定番になりがちで、似た見た目になる。ほかのアイコンセットを使うと印象を変えられる。

@jonvolio · 投稿 2026-07-17
#アイコン#AIっぽさ対策#UI

どんな問題を解決するか / いつ使うか

AIで作ったUIを「よくある見た目」から離したいとき。

やり方

  1. 候補：Phosphor（duotoneが特に良い）、Iconoir、Tabler、Solar、Hugeicons。Google の Material Symbols は線の太さや角の丸みを調整でき、PNG/SVGでダウンロードでき、商用利用も可。日本の行政系ならデジタル庁の無料アイコン・イラスト素材（クレジット表記不要）もある。
  2. 複数のセットを1つのプラグインで使うなら unplugin-icons（使ったアイコンだけをバンドルに含める＝tree-shaking対応）。
  3. 決めたセットはDESIGN.mdに書き、「Lucideは使わない」と禁止リストにも入れる。

注意点・対応状況

  • 1画面の中で複数のセットを混ぜない（線の太さや角の処理がそろわなくなる）。

出典

X の元の投稿を開く