アイコンライブラリパネル
アイコンライブラリパネルでは、GCP・AWS・Twemoji・React Icons のアイコンをキャンバスに配置できます。ツールバー右側の絵文字アイコンボタンを押すと表示されます。
対応プロバイダー
| プロバイダー | 説明 |
|---|---|
| GCP | Google Cloud Platform のアーキテクチャアイコン |
| AWS | Amazon Web Services のアーキテクチャアイコン |
| Twemoji | Twitter 絵文字アイコン 約1,630件（CC BY 4.0） |
| React Icons | 30+セット 約40,000件のアイコン（セット選択後にAPIで取得） |
Twemoji カテゴリ
| カテゴリ | 内容 |
|---|---|
| 顔・感情 | 笑顔・泣き顔・表情など |
| 人・体 | 人物・仕草・職業など |
| 動物・自然 | 動物・植物・天気など |
| 食べ物・飲み物 | 料理・果物・飲み物など |
| 旅行・場所 | 乗り物・建物・地形など |
| 活動 | スポーツ・ゲーム・芸術など |
| モノ | 電化製品・衣類・文具など |
| 記号 | 矢印・図形・ハートなど |
| 国旗 | 世界各国の国旗・地域旗 |
アイコンの検索と絞り込み
- プロバイダー切替: パネル上部のセレクトボックスでGCP/AWS/Twemoji/React Iconsを切り替えます
- 種別の保存: 選択中のプロバイダー（種別）はプロジェクトデータに保存され、再度開いたときに復元されます
- カテゴリフィルター: カテゴリを選択してアイコン一覧を絞り込みます
- テキスト検索: 検索ボックスにアイコン名やキーワードを入力します
- 件数表示: フィルター後/総件数が表示されます
- React Icons: セットを選択するとAPIでアイコン一覧を取得します（検索は300msのデバウンスを経てサーバーで処理されます）
- パフォーマンス保護: 全セット横断検索は2文字以上で有効になり、結果は最大500件です。セット内一覧は最大1,200件まで表示されます。
アイコンの配置
アイコンをキャンバスにドラッグ＆ドロップすると、builtinノードとして配置されます。React Icons のみアイコン色（Color）がデフォルト値で設定され、GCP/AWS/Twemoji は色未設定で追加されます。