Herramientas de imagen

Generador de favicon

Crea un paquete de favicon a partir de una imagen: tamaños PNG, un favicon.ico y las etiquetas HTML que apuntan a ellos.

Generador de favicon workspace

Cómo usarla

Elige un JPEG, PNG, WebP o GIF. Crear archivo genera el paquete. Descargar guarda un ZIP. Coloca los archivos en tu sitio y copia las etiquetas link de README.txt en el elemento head.

Ejemplo

README.txt incluye etiquetas link para el icono, el PNG de 32 píxeles y el icono Apple touch.

Entrada

A square logo PNG

Salida

favicon-pack.zip con favicon.ico, PNG a 16, 32, 48 y 180 píxeles, y README.txt

Cómo funciona

Cada tamaño se dibuja sobre un cuadrado blanco para que un logo transparente siga visible en cromados claros y oscuros del navegador. favicon.ico contiene los PNG de 16 y 32 píxeles en un contenedor PNG-in-ICO. El PNG de 48 píxeles es un icono de acceso directo general. El PNG de 180 píxeles es el tamaño Apple touch. El ZIP se almacena sin recomprimir e incluye el fragmento HTML.

Errores habituales

  • El icono se ve recortado El origen se estira a un cuadrado. Parte de una imagen cuadrada si el arte no debe estirarse.
  • Un navegador antiguo ignora favicon.ico El ICO usa PNG incrustados, que leen los navegadores actuales. Los PNG separados son la alternativa listada en el README.
  • No apareció el ZIP Crear archivo debe tener éxito antes de Descargar. Una imagen dañada falla antes de generar el paquete.

Limitaciones

El paquete no incluye un manifiesto de aplicación web, favicon SVG ni un icono maskable de 512 píxeles. La animación se reduce a un fotograma. Se rechazan archivos de más de 15 MB o 8000 píxeles por lado. La imagen no se sube.

Privacidad

El archivo permanece en tu navegador. PepsTools no lo sube, no lo almacena ni lo envía a otro servicio. Limpia la herramienta o abandona la página para liberarlo de la memoria.

Preguntas

¿Qué etiquetas debe usar el sitio?

El README del ZIP lista un enlace favicon.ico, un enlace PNG de 32 píxeles y un enlace apple-touch-icon. Cópialos en el elemento head y ajusta las rutas a donde colocaste los archivos.