Icons8 MCP server

official

Get access to MCP server SVG and MCP server PNG icons in your vibe-coding projects

What can you do with Icons8 MCP?

  • Search icons across 130 styles — Ask for icons by name or description, and the server returns matching SVG/PNG options from the Icons8 catalog.
  • Get PNG previews without a key — Request free PNG previews of icons in different styles to compare looks before committing to a final set.
  • Retrieve production-ready SVG icons — Use get_icon_svg (requires API key) to fetch scalable SVG icons that follow text color for clean integration.
  • Maintain consistent icon style per project — Have the agent save a chosen style to icons8.json so future sessions reuse the same pack automatically.
  • Replace or add icons across a project — Ask to swap existing icons to a new style or add icons to feature blocks, lists, or navigation with specified sizes.

Documentation

Icons8 MCP server

422,674 SVG and PNG icons in 130 styles, straight into the AI editor you already use

Use for free

Product Hunt

Product of the day

Huge icon packs, up to 40,000 icons in one style

130 styles to choose from

Works with

Claude Code,

Codex,

Cursor,

Windsurf

and other AI coding tools

Replace all icons in the project with trendy ones

or any other style

Add icons to all bullet lists and feature blocks,

process steps, navigation, etc.

Demos made using Icons8 MCP

Emoji style · 36 icons

29 icons, inlined as SVG

10 icons, one outline style

Color style · 27 icons

How to use Icons8 MCP

What you need

  • Claude Code, Codex, Cursor, Windsurf, VS Code, or a similar AI coding tool
  • Node.js for the plugin route in Claude Code and Codex: the bundled server runs through npx mcp-remote. The manual configs for Cursor, Windsurf and VS Code speak HTTP directly, so they need nothing to install

Step 1: connect Icons8

Claude Code

Codex

Cursor

Windsurf

VS Code

Other

One line in your terminal installs both the MCP server and the icons8 skill:

claude plugin marketplace add icons8/agent-skills && claude plugin install icons8@icons8

Copy code

Approve the server on first use, then check it with /mcp. That is the whole setup.

Rather stay inside Claude Code? These two do the same thing:

/plugin marketplace add icons8/agent-skills

Copy code

/plugin install icons8@icons8

Copy code

What the icons8 skill adds

  • One style per project, saved to icons8.json. Commit it, and the next session keeps the style instead of picking a new one.
  • A plain gear for settings, not the brand logo that shares its name.
  • Free PNG previews while you iterate, SVG only for the set you approved.

The MCP gives your agent the catalog, the skill gives it the rules. Without it the agent takes the first search result for every label, and that is how one screen ends up with icons from four different styles. Open source under Apache-2.0: github.com/icons8/agent-skills.

Step 2: unlock SVG when you need it

Everything above already works: search, PNG previews, high-res PNG at any size. SVG is the production format, and it needs a key.

The key unlocks a fifth tool, get_icon_svg: real SVG for any style in the catalog, scaling cleanly and following the text color. PNG stays free with a link back to Icons8. Subscribe for $15, then take the ready setup code from the MCP tab of your account: it comes with your key filled in. Or add the key to any config by hand:

{ "mcpServers": { "icons8mcp-svg": { "type": "http", "url": "https://mcp.icons8.com/mcp/", "headers": { "Authorization": "Bearer YOUR_API_KEY" } } } }

Copy code

In Claude Code the same thing is one command:

claude mcp add --transport http icons8mcp-svg https://mcp.icons8.com/mcp/ --header "Authorization: Bearer YOUR_API_KEY"

Copy code

Check that the key is through: run claude mcp list. Five tools means it arrived, and the fifth one is get_icon_svg. Four tools means the header is not reaching the server.

Installed the plugin in Step 1? Then your server is the bundled keyless one, so SVG stays locked no matter what you ask for. Add the keyed server above: the two run side by side, the PNG tools simply appear twice, and you can disable the keyless one in your client.

Step 3: get icons to your project

Ask for what you need. Name a style if you have one in mind, and if you do not, ask to see a few first: PNG previews are free and need no key, so comparing costs nothing.

  • “Show me a settings icon in six different Icons8 styles as PNG previews, and tell me what each style is called.”
  • “Build a settings screen. Icons from Icons8, Material Outlined, 24px.”
  • “Swap every icon in this project to Flat Color and keep the current sizes.”
  • “Add icons to the six feature blocks on the landing page, one style, 48px.”

Describing the look works too: “thin outline, no color, 24px”, “flat color for a landing page”, “hand drawn”. The skill saves whichever style your agent picks to icons8.json, so later sessions keep it automatically. All 130 styles are browsable on icons8.com/icons.

Three things worth putting in the prompt

  • The style. Name it once, the skill locks it in icons8.json for the whole project. Ids are style specific, so changing style later means picking every icon again.
  • The size. Every style was drawn for one size, from 16px glyphs to 64px color scenes. Ask your agent which size the style you picked was drawn for, and use that or double it. A 50px icon shrunk to 16px loses the detail that made it readable.
  • The format. PNG previews are free and instant, so iterate on them and ask for SVG once the set is final. SVG needs a key, see Step 2.

Here is the same screen built twice: on the left no style was named, so the agent took the first result for every label. On the right one style was named for the whole screen.

No style named

Icons arrive from four different styles: a brand logo for Settings, a full color avatar in a monochrome sidebar, an emoji for a status.

Material Outlined, 24px

18 icons, one stroke weight, one look. Every icon follows the text color, so dark mode and theming come for free.

Take a look at the live demos for inspiration. If something does not work, see the FAQ.

Frequent questions

What if it says "No API key"?

Subscribe for $15, find the MCP tab in your Icons8 account for setup code. Alternatively, get an API key from the Icons8 developer portal.

How do I keep one icon style across the whole project?

The icons8 skill from Step 1 does this for you: it picks one pack for the whole project and locks it in icons8.json. Commit the file, and the next session, or another agent, keeps the same style. Without the skill, name the style in your first prompt and repeat it whenever you add icons later. Ids are style specific: the same icon has a different id in every style, so changing style later means picking every icon again.

What formats do I get?

SVG (with API key), PNG previews available for all users.

Can I download PNG icons with MCP server for free?

Yes, PNG icon previews are available without API key when you connect to Icons8 MCP server.

What are the license terms for the free version?

All PNG icons downloaded through MCP are free to use if you provide a link back to us, in production too. Check our license here. For assets that scale in a production UI, use SVG with an API key.

Is this open source?

The skill and the plugin are Apache-2.0 on GitHub, and the skills.sh listing passes the Socket, Snyk and Gen Agent Trust Hub security audits. The icons themselves are licensed separately: free with attribution, SVG on the paid plan.

Do I need an API key?

PNG works without a key, SVG downloads require a paid API key, find it in the MCP tab of your account.

I'm requesting SVG but still getting PNG

Run claude mcp list and count the tools. Four means the key is not reaching the server, so check the Authorization header in your config, or copy the ready one from the MCP tab. Five tools and still PNG: name the format in the prompt, and if you installed the plugin, make sure your agent used the keyed server and not the bundled keyless one.

What icon size should I ask for?

The size the style was drawn for: 16px for Simple Small, 24px for Material and Windows 11, 30 to 50px for iOS, 48px and up for color styles. Detail disappears when a large style is used small. Your agent can tell you the size any style was drawn for.

Can I download icons in batches?

Not yet, but this is exactly the feature we are actively working on right now.

Does it work with OpenAI Codex?

Yes. Run codex mcp add icons8mcp --url https://mcp.icons8.com/mcp/, then add the skill with npx skills add icons8/agent-skills --skill icons8. For SVG, point Codex at your key with --bearer-token-env-var, see Step 2.

Need help?

Check our documentation or chat with us.