Generador de favicon — favicon.ico y conjunto de iconos de app

Genera los iconos que aparecen en la pestaña del navegador, la pantalla de inicio del móvil y los resultados de búsqueda, en todos los tamaños, y descárgalos en un solo ZIP.

El archivo no se envía al servidor — se procesa solo dentro del navegador de este dispositivo

Texto o emoji (1-2 caracteres) Color del texto

Grosor

Forma

Rellenar fondo Color de fondo

Margen interior 12%

Información de la app (site.webmanifest)

Nombre del sitio Nombre corto (debajo del icono en la pantalla de inicio, máximo 12 caracteres) Color del tema (color de la barra de direcciones móvil)

Mi sitio

Pestaña nueva

180 · iPhone

192 · Android

512

HTML para pegar dentro de <head>

<link rel="icon" href="/favicon.ico" sizes="32x32">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<meta name="theme-color" content="#3182f6">

Esto se basa en subir los archivos del ZIP a la ruta raíz (/) del sitio. El mismo código también está incluido en head.html.

Cómo usar Crear favicon

1Sube una imagen o elige texto, emoji y color.
2Comprueba el aspecto en cada tamaño con la vista previa.
3Pulsa [Descargar ZIP] y pega el código HTML indicado dentro de <head>.

Preguntas frecuentes

¿Qué tipo de imagen original es mejor?

Lo ideal es un PNG o SVG cuadrado de al menos 512×512. Las formas simples se ven mejor en tamaños pequeños.

¿No basta con un solo favicon.ico?

Es suficiente para navegadores antiguos, pero para la pantalla de inicio de iPhone (180px) o Android (192 y 512px) necesitas un PNG aparte.