VibeIcons

VibeIconsはブラウザで動くAIアイコン生成ツールで、いつも同じ壁にぶつかるデザイナーと開発者に向いている。使っているアイコンセットに、必要なアイコンが存在しないという壁だ。SVGアイコン生成を軸に据え、ピクセルではなくベクターとして扱う。ライブラリを乗り換えたり手描きしたりする代わりに、アイコンを言葉で説明すれば、同じ仲間に見えるものをモデルが作り出す。

この道具が狙うのはスタイルの一致であって、ただ画像を生成することではない。Heroicons、Phosphor Icons、Lucide、Material、Eva、Airbnbといった目標のパックを選ぶと、VibeIconsは線の太さ、角の処理、グリッドをそのパックに寄せる。だから新しいアイコンは既存の隣に置いても浮かない。デザインシステムを支えているのはこの一貫性で、単独で生まれたアイコンは往々にしてそれを崩す。

最大の制約は守備範囲だ。VibeIconsが作るのはUIとプロダクトのアイコンであり、ロゴやイラスト、写真調のアートを扱う場所ではない。手に入るカスタムアイコンはその範囲に収まる。出来栄えは書く説明文にも左右され、意図に合うまで何度か生成し直すことになる。クレジット制なので、試行錯誤には費用がかかる。

Getting Started

1. メールでアカウントを作成するかGoogleで続行し、ジェネレーターを開く。
2. 必要なアイコンの説明を貼り付けるか、提案されたプロンプトから始める。
3. 結果を合わせたいライブラリのスタイルを選ぶ。例えばPhosphor、Heroicons、Lucideなどだ。
4. アイコンを生成し、形と線の太さが納得できるまで文言を調整する。
5. 完成したアイコンをSVGファイルとしてダウンロードするか、整ったReactコードをコピーする。