Favicon Tools

npx add-mcp 'https://favicontools.com/api/mcp'

Añade un favicon con tu agente de codificación de IA

Claude Code, Cursor, Codex, Gemini CLI, Aider, Kiro. Todos chocan con la misma pared en los favicons: un agente puede conectar el marcado, pero no puede dibujar la imagen. Aquí está el único patrón que funciona en todas partes, y luego el manual para tu agente específico.

agente

agentecablea <link rel="icon">marcado

agentedibujafavicon.pngno puede emitir bytes

generadorfavicon.ico · apple-touch · manifestarchivos reales

navegadortu icono se renderizaen vivo

El agente lo conecta. El generador lo dibuja.

El único patrón, para cada agente

La herramienta cambia; el modo de fallo no.

Obtén archivos reales

El agente los conecta

Haz que verifique

Evita el copiar y pegar: dale al agente un generador que pueda invocar

La configuración fiable es entregar al agente algo que emita archivos reales, de modo que todo el trabajo se reduzca a un solo turno: generar, instalar, parchear, verificar.

Un servidor MCP o una skill cierra la única brecha que un modelo de lenguaje no puede: los bytes de la imagen. Con uno conectado, un agente apunta a un emoji, un logo en el repositorio o una URL de imagen, y recibe un conjunto completo de favicon, icono de app y PWA colocado según la convención de tu framework, sin zip, sin descompresión manual, sin arrastrar y soltar.

Elige tu agente

Cada manual cubre dónde tropieza ese agente (el sandbox, el commit, la caché) y exactamente qué decirle.

Claude Code

Genera e instala un conjunto completo de favicon e iconos de app con Claude Code: dale al agente un generador para ejecutar, luego haz que conecte el head y haga commit de los archivos.

Codex

Añade un conjunto completo de favicon e iconos de app con OpenAI Codex. Obtén archivos de imagen reales en la rama, deja que el agente conecte el head y el manifest, y verifica que lleguen al PR.

Cursor

Instala un conjunto completo de favicon e iconos de app con Cursor: genera los archivos de imagen reales, luego haz que el agente conecte el head y el manifest según la convención del repositorio.

GitHub Copilot

Añade un favicon con GitHub Copilot: modo agente o el agente de codificación. Obtén archivos de imagen reales en el repositorio, deja que conecte el head y el manifest, y revisa el PR.

Gemini CLI

Instala un conjunto completo de favicon con el Gemini CLI de Google: conecta un generador vía MCP o un CLI, luego deja que el agente coloque los archivos, conecte el head y verifique cada ruta.

Windsurf

Añade favicons e iconos de app en Windsurf: dale a Cascade los archivos exportados, una instrucción de conexión precisa, y haz que verifique que cada ruta de icono devuelve un archivo real.

Cline

Añade un favicon con Cline: planifica la conexión en modo Plan, conecta un generador desde el marketplace de MCP para los bytes, luego aprueba las ediciones del head y el manifest en modo Act.

Aider

Añade favicons con Aider: coloca los archivos de imagen exportados en el repositorio, deja que el agente nativo de git conecte el head y el manifest, y mantén cada cambio como su propio commit.

Devin

Añade un favicon con Devin: dale archivos de imagen reales, una instrucción acotada, y haz que use su navegador para confirmar que el icono realmente se renderiza antes de abrir el PR.

Jules

Añade un favicon con Jules: haz commit de la fuente, aprueba un plan acotado antes de que se ejecute en la VM en la nube, luego revisa el PR para confirmar que los archivos de imagen reales están incluidos.

Kiro

Añade favicons en Kiro: genera los archivos reales, conéctalos mediante una tarea de especificación, y usa steering más un hook de agente para que los iconos nunca regresen silenciosamente en el rebuild.

Dónde fallan los agentes

El mismo puñado de errores explica casi todas las pestañas en blanco después de que un agente "añadió el favicon".

Aceptar un data URI base64 o un SVG solitario: los iconos de Apple touch, las pantallas de inicio de Android y los navegadores antiguos necesitan archivos reales en disco.

Fusionar un diff cuyo marcado referencia iconos que el commit nunca contuvo, generalmente porque una regla de ignore descartó los binarios.

Confiar en un resumen ordenado en lugar de leer el diff y confirmar que los archivos de imagen están realmente en stage.

Dejar que una ejecución posterior vuelva a añadir un favicon de plantilla inicial porque la convención nunca se documentó para el agente.

¿Construyendo con un constructor de apps de IA sin código?

Lovable, v0, Bolt, Replit, Framer y similares generan una app completa desde prompts. El paso del favicon vive en otro lugar. El hub de vibe-coding cubre esos casos.

Favicons para apps construidas con IA

FAQ

¿Puede un agente de IA generar un favicon?

Puede hacer todas las partes excepto la imagen en sí. Un modelo de lenguaje genera texto, por lo que no puede emitir los bytes binarios de un PNG o ICO. Dale al agente un generador para invocar (un CLI, un servidor MCP o una skill) y manejará la generación, la colocación de archivos, el marcado del head y la verificación de principio a fin.

¿Cuál es la diferencia entre esta página y /vibecode?

Esta página es para agentes de codificación que editan un repositorio real: Claude Code, Cursor, Codex, Gemini CLI, Aider, Kiro. /vibecode es para constructores de apps de IA sin código como Lovable, v0 y Bolt, donde describes una app en lugar de editar archivos. El patrón del favicon es similar, pero dónde viven los archivos y cómo se hace commit difiere.

¿Cómo ayuda un servidor MCP con los favicons?

MCP permite que un agente invoque una herramienta externa como si estuviera integrada. Conecta un generador de favicons como servidor MCP y el agente puede solicitar un conjunto de iconos real y recibir archivos reales, cerrando la única brecha, los bytes de imagen, que el modelo no puede llenar por sí mismo. Agentes como Claude Code y Gemini CLI soportan MCP directamente.

¿Por qué la pestaña sigue mostrando el icono antiguo después de la edición del agente?

Dos causas habituales. O los archivos de imagen nunca llegaron al commit (verifica con git status y busca una regla de ignore que coincida con binarios), o el navegador está sirviendo un favicon en caché. Reinicia el servidor de desarrollo y carga la página en una ventana privada antes de asumir que la edición falló.