Toolbox Hub
Todas las herramientas

Favicon Generator

Generate favicons

Generate favicons Se ejecuta localmente en su navegador

About the

El Favicon Generator toma una imagen, la recorta en un cuadrado desde el centro y produce un archivo de ícono de 64 por 64 que puede colocar en la raíz de un sitio. El recorte importa más de lo que parece: los navegadores muestran los favicons en forma cuadrada, por lo que un logotipo ancho comprimido en un cuadrado se ve mal, mientras que un recorte central generalmente conserva la parte reconocible. La imagen se procesa en un lienzo en su navegador, por lo que no se carga nada.

Where people use the

  • Generar un favicon a partir de un logotipo antes del lanzamiento de un sitio.
  • Producir un ícono rápido para un prototipo o una herramienta interna.
  • Reemplazo de un icono de marcador de posición que quedó de una plantilla.
  • Hacer una versión cuadrada de un logotipo ancho para usarlo en una pestaña.

How to use the

  1. 1

    Sube una imagen

    Elija el logotipo o la imagen que desee utilizar. Una imagen de origen cuadrada proporciona el mejor resultado porque no se corta nada.

  2. 2

    Déjalo recortar y cambiar el tamaño.

    El lado más corto se utiliza como cuadrado de recorte, tomado del centro, y el resultado se dibuja en 64 por 64.

  3. 3

    Compara las dos vistas previas

    El original y el ícono se muestran uno al lado del otro para que pueda ver lo que se eliminó el recorte.

  4. 4

    Descarga el icono

    Guarde el archivo como favicon.ico y colóquelo en la raíz de su sitio, o cárguelo donde su marco espere activos estáticos.

Consejos y mejores prácticas

  • Sube una imagen cuadrada para evitar perder los bordes de un logotipo ancho.
  • Dale al ícono un fondo liso si se mostrará tanto en pestañas claras como oscuras.
  • Recarga completa después de cargar; Los navegadores almacenan en caché los favicons de forma agresiva.

Preguntas frecuentes

¿Por qué mi logo está recortado?

Porque los favicons son cuadrados. La herramienta toma el cuadrado más grande que quepa, desde el centro. Una imagen de origen cuadrada evita el recorte por completo.

¿Qué talla debo subir?

Al menos 64 por 64, y cuadrado si puedes. Las imágenes más grandes simplemente se reducen; los más pequeños se verán suaves.

¿Necesito más de una talla?

Para la mayoría de los sitios, un ícono es suficiente, porque los navegadores reducen el tamaño de un ícono de 64 píxeles para las pestañas. Si desea resultados nítidos en todas partes, genere versiones de 16, 32 y 180 píxeles por separado.

¿A dónde va el archivo?

En la raíz del sitio como favicon.ico, que los navegadores solicitan por convención. Si su marco sirve archivos estáticos desde un directorio como public, colóquelo allí.

¿Por qué la pestaña todavía muestra el ícono antiguo?

Porque está en caché. Vuelva a cargar la página o ábrala en una ventana privada y aparecerá el nuevo icono.

Herramientas relacionadas