Svg/icons MCP — Claude Code MCP server: icon search and export
Wires your coding assistant to a catalog of 320K+ open-source SVG icons: search, UI recommendations, PNG export and collections.
claude mcp add --transport http mcp https://svgicons.com/mcpWhat Svg/icons MCP does
The server is hosted and speaks Streamable HTTP at https://svgicons.com/mcp. Nothing runs on your machine. Assistants can search icons and icon sets, pull icon metadata, and get icon suggestions for a described screen. No account is needed for that part.
Anonymous calls are rate-limited per method, and a search or recommendation returns at most 10 icons. Raw SVG, PNG export and every Icon Collection tool sit behind Pro — either OAuth 2.0 with PKCE, or a scoped token sent as Authorization: Bearer YOUR_API_TOKEN. Hand each client the narrowest scopes it needs: mcp:use plus search:read covers search, add icons:read for raw SVG.
Pro lifts search to 50 icons per call and opens all 12 tools: create, list, read and extend collections, add or remove icons, render PNG, and queue a collection export as SVG folders, sprites, React/Vue/Svelte/Solid/Blade components, Storybook galleries, npm scaffolds, Iconify JSON, or JSON and license manifests. Custom icons in a collection export their own snapshot rather than the catalog version.
What it helps with
- find an icon by query or set prefix
- pick icons for a described screen
- export a collection as React components
- render a PNG pack from icons
- build a sprite or Iconify JSON
Example prompts for the agent
- Find icons for a settings panel and show their metadata
- Recommend icons for an onboarding screen
- Create an icon collection for this project and export it as React components
How to install Svg/icons MCP
Platform CLI: remote server
claude mcp add --transport http mcp https://svgicons.com/mcpPlatform CLI: remote server
codex mcp add svgicons-mcp --url https://svgicons.com/mcpConfig file
{
"mcpServers": {
"svgicons-mcp": {
"url": "https://svgicons.com/mcp"
}
}
}Config file
{
"servers": {
"svgicons-mcp": {
"type": "http",
"url": "https://svgicons.com/mcp"
}
}
}Platform CLI: remote server
gemini mcp add -t http svgicons-mcp https://svgicons.com/mcpStep by step, with commands for each platform: How to add an MCP server to Claude Code, Codex, Cursor, VS Code, Gemini CLI and more
Questions about Svg/icons MCP
How do I install Svg/icons MCP in Claude Code?
Run claude mcp add --transport http svgicons https://svgicons.com/mcp, then run /mcp inside Claude and finish the OAuth sign-in. To use a Pro token instead, append --header "Authorization: Bearer YOUR_API_TOKEN" to the command.
What does Svg/icons MCP do?
It gives an assistant access to an open-source SVG icon catalog: metadata search, icon suggestions for a UI, and with Pro the raw SVG, PNG export and persistent icon collections.
What do I need for raw SVG and collections?
A Pro account, either through OAuth 2.0 or a scoped API token. Anonymous access covers search, metadata and icon recommendations only.
