Generador de favicon
Favicon Generator
Produce el juego completo de iconos —ICO, PNG, icono de Apple y manifiesto web— junto con el HTML para pegar.
Un favicon dejó de ser un solo archivo hace años: un sitio necesita el .ico para la petición a la raíz, PNG en tres tamaños para las barras de pestañas, un icono táctil de Apple porque iOS ignora el manifiesto y un icono enmascarable porque Android recorta a una forma que él elige. Esta herramienta produce todos, el manifiesto y el código para pegar.
Suelta tu logotipo
Un PNG cuadrado de 512×512 o más da el mejor resultado. El SVG hay que rasterizarlo antes.
Cómo se usa
Suelta un logotipo cuadrado de 512 px o más
Todo se deriva reduciendo, así que el icono más grande del conjunto es tan bueno como aquello con lo que empezaste y no mejor.
Fija el nombre y el nombre corto
El nombre corto es lo que aparece bajo el icono en una pantalla de inicio, y tanto Android como iOS lo cortan alrededor de los doce caracteres.
Elige los colores de tema y de arranque
Van al manifiesto: el color de tema tiñe la interfaz del navegador en Android, y el de fondo es lo que muestra una PWA al abrirse antes de pintar.
Toma el zip y pega el código
Los archivos van en la raíz del sitio; el bloque `<link>` va en `<head>`. Se producen juntos para que las rutas coincidan.
Preguntas frecuentes
¿Para qué es el icono enmascarable?
Android recorta los iconos de la pantalla de inicio a una forma que elige el dispositivo —círculo, cuadrado redondeado, gota— y solo garantiza el 80 % central. El icono enmascarable siempre recibe un 10 % de relleno sea cual sea tu ajuste de relleno, para que el recorte no pueda alcanzar la obra.
¿Puedo usar un favicon SVG en su lugar?
Puedes añadir uno, y es la opción más bonita donde funciona, pero no reemplaza al conjunto. Safari en iOS quiere el icono táctil, Android quiere los iconos del manifiesto y el .ico de la raíz se pide de todos modos. Rasteriza el SVG primero y suelta el PNG aquí.
¿Cuánto relleno debo usar?
Ninguno para una marca diseñada para llenar su marco; entre el diez y el quince por ciento para un logotipo que necesita aire a 16 px. Los tamaños de barra de pestañas son donde el relleno cuesta más, porque hay muy poco espacio que ceder.
Puede recibir de
Optimizador de SVG
SVG Optimiser
Quita los restos que deja el editor, funde las transformaciones y redondea la precisión de los trazados, mostrando el resultado lado a lado.
Conversor de ICO
ICO Converter
Crea un .ico de varias resoluciones a partir de una imagen, o saca las imágenes que hay dentro de un .ico existente.
SVG a PNG
SVG to PNG
Renderiza un SVG a PNG, JPEG o WebP en cualquier factor de escala, con fondo transparente o relleno.
Compresor de PNG
PNG Compressor
Reduce la paleta de colores y reescribe el flujo comprimido para bajar el peso de un PNG sin cambiar sus dimensiones.
Después
Estas aceptan lo que produce esta herramienta, así que el resultado puede pasar directamente.
Conversor de ICO
ICO Converter
Crea un .ico de varias resoluciones a partir de una imagen, o saca las imágenes que hay dentro de un .ico existente.
Redimensionar imágenes
Image Resizer
Cambia el tamaño por píxeles, por porcentaje o fijando el lado más largo, con proporción bloqueada y ajustes preestablecidos para lotes.
Compresor de PNG
PNG Compressor
Reduce la paleta de colores y reescribe el flujo comprimido para bajar el peso de un PNG sin cambiar sus dimensiones.
Optimizador de SVG
SVG Optimiser
Quita los restos que deja el editor, funde las transformaciones y redondea la precisión de los trazados, mostrando el resultado lado a lado.
Quitar el fondo de una imagen
Background Remover
Recorta un fondo plano o de un solo color en el espacio OKLab y devuelve un PNG transparente, con pincel para corregir los bordes.
Borrar los datos EXIF de una foto
EXIF Remover
Elimina los metadatos de cámara, GPS y edición de las fotos sin tocar un solo píxel, y sin que la foto salga de tu navegador.