Icons8 MCP server

Servidor MCP de Icons8

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 con los modernos

o cualquier otro estilo

Añade iconos a todas las listas con viñetas y bloques de características,

pasos de proceso, navegación, etc.

Demos hechos 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 similar de codificación con IA
• 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

Otro

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, 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. Hazle commit, y la próxima sesión mantiene el estilo en lugar de elegir uno nuevo.
• Un engranaje simple para ajustes, no el logotipo de la marca que comparte su nombre.
• Vistas previas PNG gratuitas mientras iteres, 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 en cualquier tamaño. SVG es el formato de producción y necesita una clave. Suscríbete por $15, 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

Si instalaste el plugin, el servidor con clave se ejecuta junto al incluido sin clave, así que las herramientas PNG aparecen dos veces. Eso es inofensivo; si te molesta, desactiva el servidor del plugin y mantén tu propia entrada.

Paso 3: lleva iconos a tu proyecto

Pide lo que necesites. Nombra un estilo si tienes uno en mente, y si no, 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 ajustes en seis estilos diferentes de Icons8 como vistas previas PNG, y dime cómo se llama cada estilo."
• "Crea una pantalla de ajustes. 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 características de la página de inicio, 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 son navegables en icons8.com/icons.

Tres cosas que vale la pena incluir 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 elegir cada icono de nuevo.
• 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.

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 monocroma, 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 próxima sesión, u otro agente, mantiene 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 elegir cada icono de nuevo.

¿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 para usar si proporcionas un enlace de vuelta a nosotros, también en producción. Consulta nuestra licencia aquí. Para activos que escalan en una interfaz de producción, usa SVG con una clave API.

¿Es esto 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í están licenciados por separado: gratis 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 obteniendo PNG

Configura tu clave API en la pestaña MCP, o solicita explícitamente el formato SVG.

¿Qué tamaño de icono debo 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 el tamaño para el que fue dibujado cualquier estilo.

¿Puedo descargar iconos en lotes?

Aún no, pero es exactamente la característica en la que estamos trabajando activamente ahora.

¿Funciona con OpenAI Codex?

Sí. Ejecuta codex plugin marketplace add icons8/agent-skills, luego instala icons8 desde el navegador de plugins. El servidor MCP viene incluido, consulta el Paso 1.

¿Necesitas ayuda?

Consulta nuestra documentación o chatea con nosotros.