Generador de Favicon Online
Crea favicons profesionales desde imagen o texto. 8 tamaños, snippet HTML incluido. Sin registro.
Arrastra una imagen o haz clic
PNG, JPG, WebP, SVG
Tamaños a exportar
Código HTML para tu <head>
<!-- Favicon básico --> <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"> <!-- Apple Touch Icon --> <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> <!-- Android / PWA --> <link rel="icon" type="image/png" sizes="192x192" href="/favicon-192x192.png">
Hecho por
Miguel Ángel Colorado Marin
Hecho por
Miguel Ángel Colorado Marin
Full-Stack Developer · Guadalajara, España
Desarrollo aplicaciones web, herramientas digitales y proyectos completos — desde el diseño hasta el despliegue.
Cómo crear un favicon online
- 1
Elige el modo de entrada
Selecciona 'Desde imagen' para subir un logo existente en PNG, JPG o WebP. Elige 'Desde texto/emoji' para crear un favicon con iniciales o un emoji sin ninguna imagen de partida.
- 2
Personaliza el diseño
Si usas texto, ajusta el color de fondo, el color del texto y la tipografía hasta que el icono luzca exactamente como quieres. La vista previa a 32px, 64px y 128px te muestra el resultado real.
- 3
Selecciona los tamaños a exportar
Marca las casillas de los tamaños que necesitas. Para la mayoría de webs, con 16px, 32px, 180px y 192px es suficiente. Para apps PWA completas, añade también el 512px.
- 4
Descarga y añade el HTML
Haz clic en 'Descargar' para obtener cada PNG. Copia el snippet HTML del panel y pégalo dentro del <head> de tu web. Ya tienes un favicon profesional funcionando.
¿Por qué necesitas un favicon?
El favicon es el pequeño ícono que aparece en la pestaña del navegador, en los marcadores y en la pantalla de inicio de los dispositivos móviles. Un favicon bien diseñado mejora el reconocimiento de marca, hace que tu web se distinga entre múltiples pestañas abiertas y transmite profesionalidad a primera vista.
Los navegadores modernos requieren distintos tamaños para diferentes contextos: el clásico 16x16 para la pestaña, 32x32 para pantallas de alta resolución, 180x180 para el Apple Touch Icon en iOS, y 192x512 para Progressive Web Apps. Este generador produce todos los formatos en segundos.
Todo el procesamiento se realiza en el navegador mediante la Canvas API de JavaScript. Esto significa que tus imágenes nunca se envían a ningún servidor, garantizando la privacidad total de tus activos visuales.
Preguntas frecuentes
¿Qué tamaños de favicon necesito para una web?
Lo mínimo recomendado es 16x16 y 32x32 para el favicon del navegador, más 180x180 para Apple Touch Icon. Si tu web es una PWA, también necesitas 192x192 y 512x512.
¿Cuál es la diferencia entre favicon.ico y favicon.png?
El formato .ico puede contener múltiples tamaños en un solo archivo y tiene compatibilidad histórica. Los archivos PNG individuales son más flexibles y son el estándar moderno recomendado.
¿Mis imágenes se suben a algún servidor?
No. El procesamiento ocurre 100% en tu navegador usando la Canvas API. Ningún dato de tu imagen sale de tu dispositivo.
¿Puedo usar un emoji como favicon?
Sí. Escribe cualquier emoji en el campo de texto y elige colores. El generador renderiza el emoji en canvas para producir un PNG nítido a cualquier tamaño.
¿Por qué necesito el Apple Touch Icon de 180x180?
Cuando un usuario añade tu web a la pantalla de inicio de un iPhone, iOS usa ese ícono. Sin él, iOS captura una miniatura de la página que suele verse mal.
Herramientas relacionadas
Embebe esta herramienta
<iframe src="https://miguelacm.es/embed/favicon-generator" width="100%" height="700" style="border:none;border-radius:16px;" loading="lazy"></iframe>