Which integrations are available for this server?

Allows searching over 100,000 SVG icons from the AntV Infographic icon library using semantic search, returning SVG URLs for use in infographics.

How do I use mcp-icon?

1. Click on "Install Server". 2. Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state. 3. In the chat, type @ followed by the MCP server name and your instructions, e.g., "@mcp-icon search for an icon representing data analytics" That's it! The server will respond to your query, and you can continue using it as needed. Here is a step-by-step guide with screenshots.

🎨 mcp-icon

A Model Context Protocol (MCP) server for semantic SVG icon search.

Generate infographic SVG icons by keyword — over 100,000 icons with semantic search support, powered by AntV Infographic.

📋 Table of Contents

Related MCP server: icogenie-mcp

✨ Features

🔍 Semantic search — Find icons by meaning, not just exact names
🖼️ 100,000+ SVG icons — A massive library of high-quality infographic icons
⚡ Three transport modes — stdio, sse, and streamable-http
🪶 Minimal dependencies — Clean, focused implementation
🧪 Fully tested — Unit tests with Vitest

Available Tool

Tool	Description
`search_icons`	Search for SVG icons by keyword. Returns a list of SVG URLs matching the semantic query.

search_icons parameters:

Parameter	Type	Required	Default	Description
`keyword`	string	✅	—	Search keyword or phrase (e.g. `"data analysis"`, `"cloud"`)
`topK`	number	❌	`3`	Number of icons to return (1–20)

🤖 Usage

Add to your MCP client configuration (e.g. Claude Desktop, VS Code, Cursor):

macOS / Linux:

{
  "mcpServers": {
    "mcp-icon": {
      "command": "npx",
      "args": ["-y", "mcp-icon"]
    }
  }
}

Windows:

{
  "mcpServers": {
    "mcp-icon": {
      "command": "cmd",
      "args": ["/c", "npx", "-y", "mcp-icon"]
    }
  }
}

🚰 Transport Modes

mcp-icon supports three standard MCP transport protocols.

stdio (default)

Used by desktop MCP clients (Claude Desktop, Cursor, etc.):

npx mcp-icon
# or explicitly:
npx mcp-icon --transport stdio

SSE (Server-Sent Events)

npx mcp-icon --transport sse --port 3456
# Server available at: http://localhost:3456/sse

Streamable HTTP

npx mcp-icon --transport streamable --port 3456
# Server available at: http://localhost:3456/mcp

🎮 CLI Options

mcp-icon CLI

Options:
  --transport, -t  Transport protocol: "stdio", "sse", or "streamable" (default: "stdio")
  --host, -h       Host for SSE or streamable transport (default: localhost)
  --port, -p       Port for SSE or streamable transport (default: 3456)
  --endpoint, -e   Endpoint path:
                   - For SSE: default is "/sse"
                   - For streamable: default is "/mcp"
  --help, -H       Show this help message

🔨 Development

# Clone the repository
git clone https://github.com/hustcc/mcp-icon.git
cd mcp-icon

# Install dependencies
npm install

# Build
npm run build

# Run tests
npm test

# Start with MCP inspector (for local debugging)
npm start

Project Structure

src/
├── index.ts          # CLI entry point
├── server.ts         # MCP server + tool handlers
├── services/
│   ├── stdio.ts      # Stdio transport
│   ├── sse.ts        # SSE transport
│   └── streamable.ts # Streamable HTTP transport
├── tools/
│   └── search-icons.ts  # Tool definition
└── utils/
    ├── api.ts        # Icon search API client
    └── logger.ts     # Logger utility
tests/
├── api.test.ts       # API client unit tests
└── server.test.ts    # MCP server integration tests

📄 License

MIT © hustcc

This server cannot be installed

A

license - permissive license

-

quality - not tested

D

maintenance

How are these scores calculated?

Maintenance

–Maintainers

–Response time

–Release cycle

–Releases (12mo)

Commit activity

Resources

Need Help?

Related Servers

mcp-icon