Icons8 MCP server

Icons8 MCP server

422,674 iconos SVG y PNG en 130 estilos, directamente en el editor de IA que ya usas

Úsalo gratis

Product Hunt

Producto del día

Paquetes de iconos enormes, hasta 40,000 iconos en un solo estilo

130 estilos para elegir

Funciona con

Claude Code,

Codex,

Cursor,

Windsurf

y otras herramientas de codificación con IA

Reemplaza todos los iconos del proyecto por unos modernos

o cualquier otro estilo

Añade iconos a todas las listas con viñetas y bloques de funciones,

pasos de proceso, navegación, etc.

Demos creadas con Icons8 MCP

Estilo Emoji · 36 iconos

29 iconos, incrustados como SVG

10 iconos, un estilo de contorno

Estilo Color · 27 iconos

Cómo usar Icons8 MCP

Lo que necesitas

• Claude Code, Codex, Cursor, Windsurf, VS Code o una herramienta de codificación con IA similar
• Node.js para la ruta del plugin en Claude Code y Codex: el servidor incluido se ejecuta a través de npx mcp-remote. Las configuraciones manuales para Cursor, Windsurf y VS Code hablan HTTP directamente, así que no necesitan instalar nada

Paso 1: conecta Icons8

Claude Code

Codex

Cursor

Windsurf

VS Code

Otros

Una línea en tu terminal instala tanto el servidor MCP como la skill de icons8:

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

Copiar código

Aprueba el servidor en el primer uso y luego verifícalo con /mcp. Eso es toda la configuración.

¿Prefieres quedarte dentro de Claude Code? Estos dos hacen lo mismo:

/plugin marketplace add icons8/agent-skills

Copiar código

/plugin install icons8@icons8

Copiar código

Qué añade la skill de icons8

• Un estilo por proyecto, guardado en icons8.json. Haz commit del archivo y la siguiente sesión mantendrá el estilo en lugar de elegir uno nuevo.
• Un engranaje simple para la configuración, no el logotipo de la marca que comparte su nombre.
• Vistas previas PNG gratuitas mientras iteras, SVG solo para el conjunto que apruebes.

El MCP le da a tu agente el catálogo, la skill le da las reglas. Sin ella, el agente toma el primer resultado de búsqueda para cada etiqueta, y así es como una pantalla termina con iconos de cuatro estilos diferentes. Código abierto bajo Apache-2.0: github.com/icons8/agent-skills.

Paso 2: desbloquea SVG cuando lo necesites

Todo lo anterior ya funciona: búsqueda, vistas previas PNG, PNG de alta resolución a cualquier tamaño. SVG es el formato de producción y necesita una clave.

La clave desbloquea una quinta herramienta, get_icon_svg: SVG real para cualquier estilo del catálogo, que se escala limpiamente y sigue el color del texto. PNG sigue siendo gratuito con un enlace de vuelta a Icons8. Suscríbete por $15 y luego toma el código de configuración listo de la pestaña MCP de tu cuenta: viene con tu clave ya rellenada. O añade la clave a cualquier configuración manualmente:

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

Copiar código

En Claude Code lo mismo es un solo comando:

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

Copiar código

Comprueba que la clave ha llegado: ejecuta claude mcp list. Cinco herramientas significa que llegó, y la quinta es get_icon_svg. Cuatro herramientas significa que el encabezado no está llegando al servidor.

¿Instalaste el plugin en el Paso 1? Entonces tu servidor es el incluido sin clave, así que SVG permanece bloqueado sin importar lo que pidas. Añade el servidor con clave de arriba: los dos funcionan en paralelo, las herramientas PNG simplemente aparecen dos veces, y puedes desactivar el que no tiene clave en tu cliente.

Paso 3: lleva iconos a tu proyecto

Pide lo que necesites. Nombra un estilo si tienes uno en mente, y si no lo tienes, pide ver algunos primero: las vistas previas PNG son gratuitas y no necesitan clave, así que comparar no cuesta nada.

• "Muéstrame un icono de configuración en seis estilos diferentes de Icons8 como vistas previas PNG, y dime cómo se llama cada estilo."
• "Crea una pantalla de configuración. Iconos de Icons8, Material Outlined, 24px."
• "Cambia cada icono de este proyecto a Flat Color y mantén los tamaños actuales."
• "Añade iconos a los seis bloques de funciones de la página de aterrizaje, un estilo, 48px."

Describir el aspecto también funciona: "contorno fino, sin color, 24px", "color plano para una página de aterrizaje", "dibujado a mano". La skill guarda el estilo que tu agente elija en icons8.json, así que las sesiones posteriores lo mantienen automáticamente. Los 130 estilos se pueden explorar en icons8.com/icons.

Tres cosas que vale la pena poner en el prompt

• El estilo. Nómbralo una vez, la skill lo fija en icons8.json para todo el proyecto. Los IDs son específicos del estilo, así que cambiar de estilo más tarde significa volver a elegir cada icono.
• El tamaño. Cada estilo fue dibujado para un tamaño, desde glifos de 16px hasta escenas de color de 64px. Pregunta a tu agente para qué tamaño fue dibujado el estilo que elegiste, y usa ese o el doble. Un icono de 50px reducido a 16px pierde el detalle que lo hacía legible.
• El formato. Las vistas previas PNG son gratuitas e instantáneas, así que itera sobre ellas y pide SVG una vez que el conjunto esté final. SVG necesita una clave, ver Paso 2.

Aquí está la misma pantalla construida dos veces: a la izquierda no se nombró ningún estilo, así que el agente tomó el primer resultado para cada etiqueta. A la derecha se nombró un estilo para toda la pantalla.

Sin estilo nombrado

Los iconos llegan de cuatro estilos diferentes: un logotipo de marca para Configuración, un avatar a todo color en una barra lateral monocromática, un emoji para un estado.

Material Outlined, 24px

18 iconos, un grosor de trazo, un aspecto. Cada icono sigue el color del texto, así que el modo oscuro y los temas vienen gratis.

Echa un vistazo a las demos en vivo para inspirarte. Si algo no funciona, consulta las preguntas frecuentes.

Preguntas frecuentes

¿Qué pasa si dice "No API key"?

Suscríbete por $15, encuentra la pestaña MCP en tu cuenta de Icons8 para el código de configuración. Alternativamente, obtén una clave API desde el portal de desarrolladores de Icons8.

¿Cómo mantengo un estilo de icono en todo el proyecto?

La skill de icons8 del Paso 1 hace esto por ti: elige un paquete para todo el proyecto y lo fija en icons8.json. Haz commit del archivo, y la siguiente sesión, u otro agente, mantendrá el mismo estilo. Sin la skill, nombra el estilo en tu primer prompt y repítelo cada vez que añadas iconos más tarde. Los IDs son específicos del estilo: el mismo icono tiene un ID diferente en cada estilo, así que cambiar de estilo más tarde significa volver a elegir cada icono.

¿Qué formatos obtengo?

SVG (con clave API), vistas previas PNG disponibles para todos los usuarios.

¿Puedo descargar iconos PNG con el servidor MCP gratis?

Sí, las vistas previas de iconos PNG están disponibles sin clave API cuando te conectas al servidor MCP de Icons8.

¿Cuáles son los términos de licencia para la versión gratuita?

Todos los iconos PNG descargados a través de MCP son gratuitos si proporcionas un enlace de vuelta a nosotros, también en producción. Consulta nuestra licencia aquí. Para activos que se escalan en una interfaz de producción, usa SVG con una clave API.

¿Es esto de código abierto?

La skill y el plugin son Apache-2.0 en GitHub, y el listado de skills.sh pasa las auditorías de seguridad de Socket, Snyk y Gen Agent Trust Hub. Los iconos en sí tienen una licencia separada: gratuitos con atribución, SVG en el plan de pago.

¿Necesito una clave API?

PNG funciona sin clave, las descargas SVG requieren una clave API de pago, encuéntrala en la pestaña MCP de tu cuenta.

Estoy solicitando SVG pero sigo recibiendo PNG

Ejecuta claude mcp list y cuenta las herramientas. Cuatro significa que la clave no está llegando al servidor, así que revisa el encabezado Authorization en tu configuración, o copia el que está listo desde la pestaña MCP. Cinco herramientas y aún PNG: nombra el formato en el prompt, y si instalaste el plugin, asegúrate de que tu agente usó el servidor con clave y no el incluido sin clave.

¿Qué tamaño de icono debería pedir?

El tamaño para el que fue dibujado el estilo: 16px para Simple Small, 24px para Material y Windows 11, 30 a 50px para iOS, 48px y más para estilos de color. El detalle desaparece cuando un estilo grande se usa pequeño. Tu agente puede decirte para qué tamaño fue dibujado cualquier estilo.

¿Puedo descargar iconos en lotes?

Todavía no, pero es exactamente la función en la que estamos trabajando activamente ahora mismo.

¿Funciona con OpenAI Codex?

Sí. Ejecuta codex mcp add icons8mcp --url https://mcp.icons8.com/mcp/, luego añade la skill con npx skills add icons8/agent-skills --skill icons8. Para SVG, apunta Codex a tu clave con --bearer-token-env-var, ver Paso 2.

¿Necesitas ayuda?

Consulta nuestra documentación o chatea con nosotros.