mcpField
K
Keyline Icons

Keyline Icons

Local
keylineicons.comMedia & Design186Updated 2d ago
RepositoryVisit website

About Keyline Icons

Keyline Icons is an offline MCP server for agents that need to find icons and retrieve their SVG or React usage. Its bundled icon set requires no API key or network connection.

Key features

  1. 01Describe icon set and styles
  2. 02Search icons by name
  3. 03Retrieve SVG with style options
  4. 04Get React imports and JSX

Use cases

  1. 01Find the correct icon name
  2. 02Inspect SVG source for an icon
  3. 03Add an icon to a React project

MCP support

Exposes tools to MCP clients for describing and searching the icon set, retrieving SVG source, and getting React usage.

Configuration

Local server config is the same for every client. Copy it into your client’s MCP config file.

mcp.json · Universal config
{
  "mcpServers": {
    "com-keylineicons": {
      "command": "npx",
      "args": [
        "-y",
        "@keyline-icons/mcp"
      ]
    }
  }
}
Run commandnpx -y @keyline-icons/mcp

Local servers need a runtime on your machine (e.g. Node.js 18+). Config file locations differ by client; see your client’s docs.

Packages
npm@keyline-icons/mcp2.2.0

Tools

4

Saved tool list · updated 3d ago

ParameterTypeRequiredDescription
limitintegerNoMax results. Default 25.
querystringYesSubstring to match, e.g. `arrow` or `mail`.
styleenumNoOnly return icons that have this style.stroke | two-tone | duotone | fill

Details

From the project README
Keyline Icons logo

@keyline-icons/mcp

An MCP server for Keyline Icons. Lets an agent search the set, read an icon's SVG, and get the right React import, without guessing at names.

Install

Claude Code:

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

Anything else that speaks MCP over stdio:

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

No API key, no network. The whole set ships inside the package.

Tools

ToolWhat it does
describe_setCounts, styles, and the rule deciding which icons have which style. Worth calling first.
search_iconsFind icons by name. Returns which styles each has.
get_iconFull SVG source for one name, style and corner treatment, regular or sharp.
get_react_usageThe import line and JSX from @keyline-icons/react, sharp entry points included.

Why the tools are shaped this way

Names are guessable but not obvious. Compounds read base-first, so a mail icon with a tick is mail-check and not check-mail, and containers are prefixes: square-arrow-down. search_icons ranks exact over prefix over word-boundary over substring, so searching check returns check before the twelve compounds containing it.

A missing style is a real answer, not an error. bar-chart is three open strokes with no interior, so it has no fill, and the tool says exactly that rather than returning nothing. Duotone and fill need a fillable region, which comes from the glyph's own enclosed area or from a square/circle container.

Typos resolve in one turn. A name that misses is matched by substring, then by edit distance, then by leading segment, so chekc suggests check and arow suggests the arrow-* family even though there is no bare arrow icon.

Custom icons

Need icons the set does not have, drawn for your own product? Custom sets are drawn on the same grid and delivered as SVG, a Figma file and a React package.

Licence

MIT.

Comments

Markdown supported

New to MCP?

From what the protocol is to installing your first server, these answers cover most first questions.

An open protocol that defines how AI applications connect to external tools and data in a uniform way. Clients talk to the model; MCP servers provide tools, resources and prompt templates. They exchange standard messages, so one server can be reused by many clients.