Keyline Icons

@keyline-icons/mcp

Keyline Icons 用の MCP サーバーです。エージェントがアイコンセットを検索したり、アイコンの SVG を読み取ったり、名前を推測することなく適切な React のインポートを取得したりできます。

インストール

Claude Code：

claude mcp add keyline-icons -- npx -y @keyline-icons/mcp

stdio 経由で MCP を利用できるその他のツール：

{
  "mcpServers": {
    "keyline-icons": {
      "command": "npx",
      "args": ["-y", "@keyline-icons/mcp"]
    }
  }
}

API キーもネットワーク接続も不要です。アイコンセット全体がパッケージに含まれています。

ツール

ツール	説明
describe_set	数、スタイル、各アイコンのスタイルを決めるルールを確認できます。最初に呼び出すのがおすすめです。
search_icons	名前でアイコンを検索します。それぞれのアイコンが持つスタイルを返します。
get_icon	名前、スタイル、角の処理（regular または sharp）を指定して、アイコンの SVG ソース全体を取得します。
get_react_usage	@keyline-icons/react からのインポート行と JSX を取得します。sharp のエントリポイントも含まれます。

ツールの設計方針

名前は推測できますが、分かりやすいとは限りません。 複合語は基本の名前が先に来るため、チェックマーク付きのメールアイコンは check-mail ではなく mail-check です。また、コンテナは接頭辞になります。たとえば square-arrow-down です。search_icons は、完全一致、接頭辞、単語境界、部分一致の順に結果を並べるため、check を検索すると、これを含む 12 個の複合語より先に check が返されます。

スタイルがないことも正しい結果であり、エラーではありません。 bar-chart は内部に何もない 3 本の開いた線で構成されているため、塗りつぶしスタイルはありません。ツールは何も返さずに終わるのではなく、そのことを正確に伝えます。デュオトーンと塗りつぶしには塗りつぶし可能な領域が必要で、それはグリフ自体に囲まれた領域があるか、正方形または円形のコンテナがあることで生まれます。

タイプミスも 1 回のやり取りで解決できます。 名前が見つからない場合は、部分一致、編集距離、先頭セグメントの順に照合します。そのため、chekc には check が提案され、単独の arrow アイコンがなくても、arow には arrow-* ファミリーが提案されます。

カスタムアイコン

アイコンセットにない、自社製品向けのアイコンが必要ですか？ カスタムセットは同じグリッド上に描画され、SVG、Figma ファイル、React パッケージとして提供されます。

ライセンス

MIT。