ES

Generador de favicon: desde una imagen, letras o un emoji

Elige letras, un emoji o tu logo, ajusta el color y la forma, y descarga todo en un ZIP: favicon.ico, todos los tamaños PNG, site.webmanifest y el HTML correspondiente. Todo se crea directamente en tu navegador, sin subir nada.

Tus archivos se procesan solo en tu navegador y no se suben a ningún servidor: no salen de tu dispositivo.

Crear favicon a partir de
Uno o dos caracteres siguen siendo legibles a 16 × 16 px.
Nombre y ruta (manifest)
«/» = carpeta raíz de tu sitio web (recomendado).

Vista previa y archivos

    HTML para el <head>
    site.webmanifest
    Resultado
    Cómo se calcula
    

    El favicon es el pequeño icono que aparece en la pestaña del navegador, en los marcadores, en el historial y junto a tu sitio en los resultados de búsqueda de Google. Este generador convierte una imagen, de una a tres letras o un emoji en todos los archivos que necesita hoy un sitio web, junto con el HTML correspondiente.
    

    ¿Qué archivos y qué tamaños?
    

    
  
    ArchivoTamañoPara qué sirve
    
  
    
    favicon.ico16, 32, 48 pxfavicon clásico; los navegadores piden /favicon.ico aunque no haya ninguna etiqueta HTML
    
    
    favicon-16x16.png, favicon-32x32.png16 y 32 pxpestaña del navegador, resolución normal y alta
    
    
    apple-touch-icon.png180 pxicono cuando alguien añade tu sitio a la pantalla de inicio del iPhone o iPad
    
    
    android-chrome-192x192.png, -512x512.png192 y 512 pxmanifiesto de aplicación web: pantalla de inicio y pantalla de bienvenida en Android/Chrome
    
    
    site.webmanifest–nombre, colores e iconos de tu sitio como aplicación web instalable
    
      

    

    Para el favicon en los resultados de búsqueda, Google exige una imagen cuadrada de al menos 8 × 8 píxeles y recomienda que sea mayor de 48 × 48 píxeles. Chrome espera iconos de 192 y 512 píxeles en el manifiesto, y Apple indica 180 × 180 píxeles para el icono de la pantalla de inicio del iPhone.
    

    Cómo añadir el favicon a tu sitio
    

      
  
    1. Descarga el ZIP y descomprímelo.
      2. 
  
    2. Sube todos los archivos a la carpeta raíz de tu sitio web (donde está tu página de inicio).
      3. 
  
    3. Pega el HTML en el <head> de cada página (WordPress, Wix, Squarespace y otros suelen tener en su lugar un ajuste «Icono del sitio»).
      4. 

    

    Si los archivos están en una subcarpeta, indícala en «Carpeta en el servidor»: el manifiesto y el HTML se ajustan solos. Los navegadores guardan los favicons en caché con mucha insistencia; a menudo, un icono nuevo solo aparece después de borrar la caché o en una ventana de incógnito.
    

    ¿Qué hace bueno a un favicon?
    


    Emoji como favicon: ojo con la licencia
    

    El emoji se dibuja con la fuente de emojis instalada en tu dispositivo, así que se ve distinto en un iPhone que en Windows o Android. El estándar Unicode solo define qué carácter es, no su aspecto. El diseño pertenece al fabricante de la fuente (por ejemplo, Apple, Microsoft o Google), y sus licencias no permiten sin más usar esas imágenes como logo o favicon de un sitio web.
    

    En una página personal el riesgo es bajo; para un sitio web comercial, usa un conjunto de emojis con licencia abierta y cumple sus condiciones:
    


    Descarga allí el emoji que quieras en PNG o SVG y elige aquí «Imagen / logo». Esto es información general, no asesoramiento legal.
    

    Privacidad
    

    Todos los archivos se crean en tu navegador. Tu imagen no se sube y no se guarda nada. Para preparar un logo, te pueden ayudar Convertir imagen y Redimensionar imagen.
    

    También te puede servir: SVG a PNG para un logo vectorial y el comprobador de contraste para colores legibles.
    

    Aligera antes un logo muy pesado con comprimir imagen.
    Preguntas frecuentes
    ¿Qué tamaño debe tener un favicon?
    16 × 16 y 32 × 32 píxeles para la pestaña del navegador, al menos 48 × 48 (cuadrado) para Google, 180 × 180 para dispositivos Apple y 192 × 192 más 512 × 512 para Android y aplicaciones web. El generador crea todos los tamaños de una vez.
    ¿Todavía necesito un favicon.ico?
    Sigue valiendo la pena: muchos navegadores, lectores de feeds y herramientas piden /favicon.ico directamente, sin ninguna etiqueta HTML. El archivo ICO que se crea aquí contiene 16, 32 y 48 píxeles como imágenes PNG.
    ¿Cómo creo un favicon y lo añado a mi sitio web?
    Créalo aquí, sube los archivos a la carpeta raíz de tu sitio y pega el HTML en el <head>. En WordPress también puedes usar «Apariencia → Personalizar → Identidad del sitio → Icono del sitio» con el PNG de 512 px.
    ¿Puedo usar un emoji como favicon?
    Los diseños de emoji de Apple, Microsoft o Google pertenecen a esas empresas. Para sitios comerciales, usa un conjunto con licencia abierta, como Twemoji (CC BY 4.0, con atribución) o Noto Emoji (OFL 1.1), y sube esa imagen aquí.
    ¿Por qué no veo mi favicon nuevo?
    Los navegadores guardan los favicons en caché durante mucho tiempo. Abre la página en una ventana de incógnito o borra la caché. En los resultados de búsqueda de Google, el cambio puede tardar de días a semanas.
    ¿Se sube mi logo a algún servidor?
    No. Todos los archivos se generan en tu navegador; tu imagen nunca sale de tu dispositivo.
    Fuentes y base legal
    Última actualización: 
    Herramientas relacionadas