unicon-mcp

# Unicon MCP

Use the Unicon MCP server to search and generate icon components through AI assistants like Claude Desktop and Cursor.

## Quick Start

### Claude Desktop

1. Open `~/Library/Application Support/Claude/claude_desktop_config.json`
2. Add:

```json
{
  "mcpServers": {
    "unicon": {
      "command": "npx",
      "args": ["-y", "@webrenew/unicon-mcp-server"]
    }
  }
}
```

3. Fully quit and restart Claude Desktop.

### Cursor

1. Open **Settings > MCP Servers**
2. Add the same JSON config shown above
3. Restart Cursor

## Verify Installation

- Claude Desktop: look for the plug icon, ensure `unicon` appears
- Cursor: run `claude mcp list` if using Claude Code

## Common Prompts

- "Search for dashboard icons in Lucide"
- "Get React component for lucide:arrow-right"
- "Generate Vue components for social media icons"
- "List available icon libraries"

## Available Tools

### search_icons

Search through 19,000+ icons with optional filters.

**Parameters**
| Parameter | Required | Description |
|-----------|----------|-------------|
| `query` | Yes | Search term |
| `source` | No | Filter by library |
| `category` | No | Filter by category |
| `limit` | No | Max results (default: 20) |
| `includeCode` | No | Return code with results |
| `strokeWidth` | No | Stroke width when includeCode=true |
| `normalizeStrokes` | No | Normalize stroke widths, skipping fill icons |

### get_icon

Return code for a single icon in a requested format.

**Parameters**
| Parameter | Required | Description |
|-----------|----------|-------------|
| `iconId` | Yes | Icon ID (e.g., "lucide:home") |
| `format` | No | svg, react, vue, svelte, json |
| `size` | No | Icon size in pixels |
| `strokeWidth` | No | Stroke width |
| `normalizeStrokes` | No | Normalize stroke widths, skipping fill icons |

### get_multiple_icons

Fetch up to 50 icons at once in a shared format.

**Parameters**
| Parameter | Required | Description |
|-----------|----------|-------------|
| `iconIds` | Yes | Array of icon IDs |
| `format` | No | Output format |
| `size` | No | Icon size in pixels |
| `strokeWidth` | No | Stroke width |
| `normalizeStrokes` | No | Normalize stroke widths, skipping fill icons |

### get_starter_pack

Get curated icon packs for common use cases.

**Parameters**
| Parameter | Required | Description |
|-----------|----------|-------------|
| `packId` | Yes | Pack identifier |
| `format` | No | Output format |
| `size` | No | Icon size in pixels |
| `strokeWidth` | No | Stroke width |
| `normalizeStrokes` | No | Normalize stroke widths, skipping fill icons |

## Resources

The MCP server exposes these resources:

| URI | Description |
|-----|-------------|
| `unicon://sources` | Library metadata (names, icon counts) |
| `unicon://categories` | Available category list |
| `unicon://stats` | Overall icon statistics |
| `unicon://starter_packs` | Curated icon packs (shadcn-ui, dashboard, etc.) |
| `unicon://instructions` | Detailed usage guide with examples |

## Troubleshooting

### Server not appearing

1. Fully quit the app (Cmd+Q on macOS)
2. Verify config JSON syntax is valid
3. Restart the application
4. Check for error logs

### Slow first start

The first `npx` run downloads the package. Subsequent runs use cache.

### Icons not found

Run `search_icons` with your query to verify the icon ID exists. Format is `source:name` (e.g., `lucide:home`).

### Connection errors

1. Ensure you have Node.js 18+ installed
2. Check internet connectivity
3. Try running manually: `npx @webrenew/unicon-mcp-server`