Keyline Icons — MCP server for Claude Code: search icons, get SVG
Lets an agent look up an icon by name and hand back its SVG source or a React import. Useful when the name has to be guessed rather than looked up.
claude mcp add mcp -- npx -y @keyline-icons/mcpWhat Keyline Icons does
The server covers three jobs: searching the set, returning full SVG source, and producing the right import from @keyline-icons/react. It speaks stdio, needs no API key, and never touches the network — the whole set ships inside the package.
Names are compound and read base-first. A mail icon with a tick is mail-check, not check-mail, and containers act as prefixes: square-arrow-down. Ranking puts an exact hit above a prefix, a prefix above a word boundary, and that above a substring, so check comes back before the twelve compounds built on it. Typos resolve in a single turn: substring first, then edit distance, then leading segment. chekc points at check; arow leads to the arrow-* family even though no bare arrow icon exists.
A missing style is an answer, not a failure. bar-chart is three open strokes with nothing inside, so it carries no fill, and the tool says so. Duotone and fill need a closed region — either the glyph's own enclosed area or a square or circle container. Start with describe_set; it returns counts, styles, and the rule that decides which icon gets which style.
What it helps with
- find an icon from an approximate name without guessing word order
- pull SVG source for a specific style and corner treatment
- get the correct import line from
@keyline-icons/react - check whether an icon supports fill before building the layout
- understand the set's styles before picking icons
Example prompts for the agent
- Find the mail icon with a tick and show its SVG in
regular. - Which styles does
bar-charthave, and why is there no fill? - Give me the import and JSX for
square-arrow-downfrom@keyline-icons/react.
How to install Keyline Icons
Platform CLI
claude mcp add mcp -- npx -y @keyline-icons/mcpPlatform CLI
codex mcp add mcp -- npx -y @keyline-icons/mcpConfig file
{
"mcpServers": {
"mcp": {
"command": "npx",
"args": [
"-y",
"@keyline-icons/mcp"
]
}
}
}Config file
{
"servers": {
"mcp": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@keyline-icons/mcp"
]
}
}
}Platform CLI
gemini mcp add mcp npx -y @keyline-icons/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 Keyline Icons
How do I install Keyline Icons in Claude Code?
Run claude mcp add mcp -- npx -y @keyline-icons/mcp.
What does Keyline Icons do?
It lets an agent search icons by name, read their SVG, and get the React import line. The set is bundled in the package, so no key or network access is involved.
Why is a style missing for an icon?
Duotone and fill require a closed region, either the glyph's own or one from a square or circle container. Without it, the tool reports that directly.
