Favicon e íconos de aplicaciones
A partir de una imagen cuadrada, crea todos los íconos que necesita un sitio web y el código para integrarlos.
- Agregar
- Ajustar
- Crear
- Conservar
Cómo usar esta herramienta
- Agrega tus archivos: arrástralos a la página o selecciónalos. Permanecen en tu dispositivo.
- Agrega una imagen de origen casi cuadrada. El sujeto debe quedar cerca del centro, ya que los tamaños más pequeños recortan visualmente la imagen.
- Elige un color de fondo para los íconos opacos y decide si quieres incluir la tarjeta para redes sociales de 1200×630.
- Selecciona «Crear conjunto de íconos» y descarga los resultados, por separado o en un solo ZIP.
Acerca de esta herramienta
A partir de una imagen cuadrada, crea todos los íconos que necesita un sitio web y el código para integrarlos. Es gratis y sin límites, y no se sube nada: todo funciona en tu navegador. Tu archivo nunca se sube a un servidor; el resultado se descarga directamente en tu dispositivo. No necesitas una cuenta y el resultado no lleva marca de agua.
Privacidad y limitaciones
Cada ejecución genera un conjunto fijo: favicon.ico (16, 32, 48 y 256 px), apple-touch-icon.png (180 px), icon-512.png y, si lo eliges, og-image.png (1200×630). No se pueden cambiar los tamaños y no se agregan entradas a manifest.json; copia los nombres de los archivos en tu propio manifiesto. La tarjeta para redes sociales se recorta del centro de la imagen a 1200×630, así que una imagen de origen alta o cuadrada pierde la parte superior e inferior. Las imágenes de origen pequeñas se amplían y se verán borrosas.
Última actualización:
Preguntas frecuentes
¿Qué tamaño debe tener la imagen de origen?
Como mínimo, 512 × 512 píxeles y cuadrada, con la ilustración a cierta distancia de los bordes. Todos los tamaños se generan a partir de esa imagen, así que, si es más pequeña, los iconos grandes pueden verse borrosos.
¿Por qué necesito tantos tamaños de icono?
Cada lugar usa un tamaño distinto: 16 píxeles en una pestaña del navegador, 180 en la pantalla de inicio de un iPhone y 512 en la pantalla de carga de Android. Si proporcionas cada tamaño, evitas que el sistema escale mal un icono de tamaño incorrecto.
¿Aún necesito favicon.ico?
Conviene incluirlo. Algunos navegadores antiguos y rastreadores solicitan directamente /favicon.ico e ignoran las etiquetas de enlace, así que el archivo ICO con varios tamaños también les sirve.
¿Para qué sirve la tarjeta Open Graph?
Es la imagen que aparece cuando compartes tu enlace en redes sociales o en un chat. Sin ella, el enlace se muestra como un rectángulo azul sin más.