Generador de favicon
Convierte un logotipo, SVG, letra o emoji en un conjunto completo de favicons para navegadores, Google, iPhone y Android, con vistas previas en directo y código de instalación listo.
Cómo usarlo: Generador de favicon
- 1
Elige un origen
Sube un logotipo en PNG, JPG, WebP o SVG y recórtalo en cuadrado, o escribe una letra o un emoji y elige la fuente y los colores.
- 2
Ajusta cada plataforma
Configura el fondo, las esquinas y el margen para navegadores, iOS y Android, haz que el icono de Android sea adaptable y revisa las vistas previas en directo de la pestaña, la búsqueda y la pantalla de inicio.
- 3
Descarga e instala
Obtén favicon.ico, favicon.svg, los iconos PNG y site.webmanifest en un solo ZIP y sigue las instrucciones para HTML, Next.js, Vite o WordPress.
Qué incluye un conjunto de favicons moderno
Un favicon es el pequeño icono que aparece en las pestañas del navegador, los marcadores y los resultados de búsqueda de Google; en los móviles se convierte en el icono de tu sitio en la pantalla de inicio. Cada plataforma pide sus propios archivos, así que un favicon moderno no es una sola imagen, sino un pequeño conjunto de imágenes más un manifiesto de aplicación web.
Sube un logotipo en PNG, JPG, WebP o SVG y recórtalo en cuadrado, o crea un icono a partir de una letra o un emoji. Después ajusta cada plataforma por separado: fondo y esquinas para los navegadores de escritorio y Google, fondo sólido y margen para la pantalla de inicio del iPhone, y un icono adaptable (maskable) para Android que mantiene tu logotipo dentro de la zona segura. Las vistas previas en directo muestran las pestañas del navegador en modo claro y oscuro, la barra de marcadores, un resultado de Google y las pantallas de inicio de iOS y Android con máscaras de círculo, squircle y cuadrado redondeado.
El ZIP sigue las buenas prácticas actuales: favicon.ico con 16, 32 y 48 px, favicon.svg si el original es un SVG (con adaptación opcional al modo oscuro), favicon-96x96.png, un apple-touch-icon.png de 180×180, iconos de manifiesto de 192 y 512 px y site.webmanifest. Copia el código HTML o sigue los pasos para Next.js, React/Vite o WordPress y, después, prueba el resultado con nuestro comprobador de favicon. Todo se genera en tu navegador.
Todo se ejecuta localmente en tu navegador: tus imágenes nunca se suben a un servidor.