Convierte PNG, JPG, SVG o WebP en un .ico real multitamaño: 16, 32 y 48 px en un solo archivo, con el alfa intacto. Elige almacenamiento PNG o BMP sin comprimir y compara ambos tamaños. También abre archivos .ico.
Suelta una imagen aquí o haz clic para buscarla
PNG, JPG, SVG, WebP, GIF o BMP · hasta 10 MB
Los dos son válidos dentro de un .ico. Windows lee PNG desde Vista y lo leen todos los navegadores actuales; el BMP sin comprimir es lo que usan de verdad 13 de los 14 archivos ICO auténticos encontrados en 20 sitios analizados, porque ImageMagick convierte a él por defecto.
<link rel="icon" href="/favicon.ico" sizes="16x16 32x32 48x48"> <link rel="icon" type="image/svg+xml" href="/icon.svg"> <link rel="apple-touch-icon" href="/apple-touch-icon.png">
Suelta un archivo .ico aquí o haz clic para buscarlo
Cada tamaño del archivo se lista por separado
| Desplazamiento | Bytes | Campo | Valor |
|---|---|---|---|
| 0 | 2 | idReserved | 0 |
| 2 | 2 | idType | 1 |
| 4 | 2 | idCount | 3 |
| 6 | 1 | bWidth[0] | 16 → 16 |
| 7 | 1 | bHeight[0] | 16 → 16 |
| 8 | 1 | bColorCount[0] | 0 |
| 9 | 1 | bReserved[0] | 0 |
| 10 | 2 | wPlanes[0] | 1 |
| 12 | 2 | wBitCount[0] | 32 |
| 14 | 4 | dwBytesInRes[0] | 248 |
| 18 | 4 | dwImageOffset[0] | 54 |
| 22 | 1 | bWidth[1] | 32 → 32 |
| 23 | 1 | bHeight[1] | 32 → 32 |
| 24 | 1 | bColorCount[1] | 0 |
| 25 | 1 | bReserved[1] | 0 |
| 26 | 2 | wPlanes[1] | 1 |
| 28 | 2 | wBitCount[1] | 32 |
| 30 | 4 | dwBytesInRes[1] | 720 |
| 34 | 4 | dwImageOffset[1] | 302 |
| 38 | 1 | bWidth[2] | 48 → 48 |
| 39 | 1 | bHeight[2] | 48 → 48 |
| 40 | 1 | bColorCount[2] | 0 |
| 41 | 1 | bReserved[2] | 0 |
| 42 | 2 | wPlanes[2] | 1 |
| 44 | 2 | wBitCount[2] | 32 |
| 46 | 4 | dwBytesInRes[2] | 1464 |
| 50 | 4 | dwImageOffset[2] | 1022 |
Escrito y revisado por los desarrolladores que construyen las utilidades de conversión de Go Tools. La estructura del contenedor, los recuentos de bytes y los modos de fallo descritos aquí proceden de una revisión de dominio por escrito, no de resúmenes del formato hechos por otros.
16, 32 y 48 px Esos tres cubren la pestaña del navegador, el selector Alt-Tab y el escritorio, y son el conjunto recomendado desde 1995. Añade 256 solo si el icono también tiene que aguantar en una vista de iconos grandes.
Sí, justamente para eso existe El formato es un contenedor: una cabecera de seis bytes, una entrada de directorio de dieciséis bytes por imagen y después las imágenes. Cada una es un dibujo independiente, y por eso un buen icono se mantiene nítido a 16 px.
No, si se hace bien Las dos maneras de guardar una imagen dentro de un .ico llevan un canal alfa completo de ocho bits. La transparencia solo se pierde cuando una herramienta deja los bytes de alfa vacíos o descarta la máscara de un bit que leen en su lugar los programas antiguos.
264 KB sin comprimir, o unos pocos KB en PNG Una capa de 256 px sin comprimir ocupa exactamente 270 376 bytes —40 bytes de cabecera, 262 144 de píxeles y 8192 de máscara— sea cual sea la imagen. Guardada como PNG, esa misma capa suele costar un par de kilobytes.
Un archivo .ico no es tanto un formato de imagen como un pequeño archivo comprimido de imágenes. Empieza con una cabecera de seis bytes que indica cuántas imágenes hay dentro, seguida de una entrada de directorio de dieciséis bytes por imagen con su ancho, su alto, su número de bytes y su posición en el archivo, y después los propios datos de imagen. Cada imagen puede guardarse de dos maneras: como un archivo PNG completo incrustado entero, o como un mapa de bits de Windows sin comprimir con una máscara de transparencia de un bit enganchada debajo.
Ese diseño es la razón de que un favicon pueda verse nítido a 16 px en una pestaña del navegador y a 48 px en un gestor de archivos: son dibujos distintos, ajustados a mano en cada tamaño, no una sola imagen reescalada. También es la razón de que el formato guarde alguna sorpresa. La longitud del lado se almacena en un único byte, así que 256 se escribe como cero y 512 no se puede escribir en absoluto. Y el directorio registra para cada entrada un tamaño que los propios datos de imagen también registran, lo que significa que ambos pueden contradecirse, y no todos los programas creen al mismo.
$ file favicon.ico
favicon.ico: MS Windows icon resource - 3 icons, 16x16, 32 bits/pixel, 32x32, 32 bits/pixel
$ python3 -c "from PIL import Image; print(sorted(Image.open('favicon.ico').ico.sizes()))"
[(16, 16), (32, 32), (48, 48)] 16, 32 y 48 px por defecto, hasta 256. Cada tamaño se dibuja por separado desde el original a máxima calidad en vez de escalarse desde la capa superior, así que los tamaños pequeños no heredan el desenfoque de uno más grande.
Los dos formatos de carga útil permitidos tienen compromisos muy distintos y la mayoría de los convertidores nunca menciona cuál escriben. Aquí es un interruptor, y se muestra el tamaño de archivo resultante en cada caso para que la decisión se tome sobre una cifra y no sobre una intuición.
El canal alfa se escribe completo, y la máscara de un bit que leen en su lugar los programas antiguos se deriva de él en vez de dejarse vacía. Dejar esa máscara vacía es justo lo que convierte un icono transparente en un cuadrado negro allí donde solo se lee la máscara.
La pestaña inversa lista todas las imágenes de un .ico con su tamaño real, su formato de almacenamiento, su profundidad de bits y el origen de su transparencia, incluidos los mapas de bits con paleta que aún usan varios favicons muy conocidos. Un navegador solo te enseñará una de ellas.
Si el directorio declara un tamaño que los datos de imagen no confirman, queda señalado. También queda señalado un PNG incrustado que Firefox va a descartar: su decodificador ICO solo admite RGB o RGBA de 8 bits, así que una capa con paleta o en escala de grises desaparece allí sin más mientras el resto de navegadores la muestran. Son dos motivos habituales de que un icono funcione en un programa y salga en blanco en otro, y ningún otro convertidor informa de ninguno de los dos.
La lectura, el redimensionado y el empaquetado ocurren todos en esta página. El archivo nunca llega a un servidor, así que no hay nada que borrar después ni ninguna cola que esperar.
magick in.png -define icon:auto-resize=48,32,16 favicon.ico La respuesta de siempre, y el motivo de que tantos favicons estén sin comprimir. Todas las capas excepto la de 256 px se convierten a mapa de bits antes de empaquetarse, así que tres tamaños salen en torno a 15 KB en vez de unos pocos cientos de bytes. Los tamaños se escriben de mayor a menor.
img.save('favicon.ico', sizes=[(16,16),(32,32),(48,48)]) Incrusta PNG, así que esos mismos tres tamaños caben en aproximadamente una décima parte del espacio. Pillow también lee bien el ICO: Image.open(f).ico.sizes() lista lo que hay dentro, algo práctico para revisar el archivo de otra persona.
npx png-to-ico icon.png > favicon.ico Una utilidad de línea de comandos de un solo propósito que toma uno o varios PNG y los empaqueta como cargas útiles PNG. Cómoda en un script de compilación; no redimensiona por ti, así que tienes que aportar cada tamaño en su propio archivo.
sharp(input).resize(32).png() Excelente para producir los PNG individuales, pero no escribe contenedores ICO, así que normalmente se combina con alguno de los empaquetadores anteriores. Es una fuente habitual de confusión cuando la cadena de compilación ya está estandarizada en sharp.
github.com/Kodeworks/golang-image-ico Escribe un ICO de una sola imagen a partir de un image.Image. Suficiente para un favicon de un solo tamaño; meter varios tamaños en un contenedor implica escribir el directorio tú mismo, unas treinta líneas.
.rc, rc.exe La forma habitual de producir los iconos de aplicación. El compilador incrusta el .ico en la sección de recursos del ejecutable; el contenedor que hay dentro tiene exactamente el mismo formato que un favicon web.
.ico Exporta cada capa de la imagen como un tamaño de icono y te deja elegir la profundidad de bits capa por capa, incluido PNG comprimido. Una de las pocas herramientas gráficas que expone esa elección en lugar de decidir en silencio.
sips -s format ico in.png --out favicon.ico macOS sí tiene un escritor de ICO: sips --formats marca com.microsoft.ico como grabable y el comando de arriba generó un archivo válido. Lo que no hace es empaquetar varios tamaños: la salida fue una única capa de 48×48. iconutil, que los resultados de búsqueda suelen sugerir, produce .icns, el contenedor propio de Apple, que Windows y los navegadores no leen.
$ xxd -l 38 favicon.ico
00000000: 0000 0100 0300 1010 0000 0100 2000 e903 ............ ... 00000010: 0000 3600 0000 2020 0000 0100 2000 6c05 ..6... .... .l. 00000020: 0000 1f04 0000 ......
0000 es el campo reservado, 0100 indica el tipo 1 (icono, no cursor) y 0300 dice que hay tres imágenes. A continuación viene la primera entrada de directorio de 16 bytes: 10 10 es 16×16, 00 el número de colores, 00 reservado, 0100 un plano, 2000 32 bits por píxel y e903 0000 son 1001 bytes de carga útil en el desplazamiento 3600 0000 = 54, que es exactamente 6 + 3 × 16, el final del directorio. Todos los números son little-endian salvo los tamaños, que ocupan un solo byte.
bWidth = 0x00 bHeight = 0x00
256 × 256
El directorio tiene un byte para cada lado, así que 255 es el número más grande que puede almacenar y 0 está definido para significar 256. Por eso tampoco se ofrece 512 px en ninguna parte de esta página: no hay ningún byte que signifique 512. Varios convertidores en línea lo ofrecen igualmente y escriben una imagen de 512 px detrás de una entrada de directorio incapaz de describirla.
16 + 32 + 48 px, PNG payloads 16 + 32 + 48 px, uncompressed BMP payloads
389 bytes 15,086 bytes
Una carga útil sin comprimir cuesta 40 + ancho × alto × 4 bytes más una máscara de 1 bit, así que su tamaño depende solo de las dimensiones y nada en absoluto de la imagen. Por eso tres sitios distintos pueden publicar tres iconos completamente diferentes en archivos de longitud idéntica.
$ magick logo.png -define icon:auto-resize=48,32,16 favicon.ico $ file favicon.ico
favicon.ico: MS Windows icon resource - 3 icons, 48x48, 32 bits/pixel, 32x32, 32 bits/pixel
ImageMagick convierte todas las capas excepto la de 256 px a un mapa de bits sin comprimir antes de empaquetarlas, y por eso su salida ronda los 15 KB en lugar de unos pocos cientos de bytes. Pillow hace lo contrario e incrusta PNG: Image.open('logo.png').save('favicon.ico', sizes=[(16,16),(32,32),(48,48)]).
$ magick favicon.ico favicon-%d.png
favicon-0.png 48×48 favicon-1.png 32×32 favicon-2.png 16×16
Un navegador no puede hacerlo por ti. Dale un .ico multitamaño a una etiqueta <img> y obtendrás exactamente una imagen —la más grande— sin importar en qué orden estén los tamaños. Saber qué hay realmente dentro de un archivo obliga a analizar el contenedor a mano, que es lo que hace la pestaña ICO → PNG.
Se aceptan PNG, JPG, SVG, WebP, GIF y BMP, hasta 10 MB. Nada sale del navegador: el archivo se lee con la File API y cada píxel se dibuja en un canvas local.
16, 32 y 48 px vienen marcados de inicio. Añade 64, 128 o 256 si el icono tiene que aguantar una vista de iconos grandes o un escritorio de alta densidad. Si tu origen es más pequeño que el mayor tamaño que has marcado, la página te lo dice en lugar de ampliarlo en silencio.
PNG es la opción por defecto porque es un orden de magnitud más pequeño y lo leen todos los navegadores actuales y todas las versiones de Windows desde Vista. Cambia a BMP sin comprimir si quieres la forma en la que están realmente casi todos los favicons publicados. Los dos tamaños de archivo se muestran uno al lado del otro.
Guarda el .ico y usa el botón Copiar etiquetas link para el marcado. La ruta /favicon.ico en la raíz sigue funcionando como alternativa, pero el elemento link explícito es la ruta que los navegadores deben probar primero.
El byte del directorio para una imagen de 256 px tiene que ser 0. Escribir 255 parece un error de uno inofensivo y produce un archivo que algunos navegadores se niegan a dibujar en silencio.
bWidth = 0xFF bHeight = 0xFF ; «255», se quería decir 256
bWidth = 0x00 bHeight = 0x00 ; 0 está definido para significar 256
Cuando una entrada de directorio dice 16×16 sobre una carga útil que en realidad es de 32×32, los descodificadores se dividen: unos se fían del directorio y no dibujan nada, otros se fían de la carga útil y la muestran bien. El archivo funciona entonces en una máquina y es invisible en otra.
entry: 16×16 payload IHDR: 32×32
entry: 32×32 payload IHDR: 32×32
Dentro de una capa sin comprimir, el alto cubre los datos de color y la máscara juntos. Escribir el alto simple produce un archivo que sale en blanco en unos descodificadores y como la mitad inferior de la imagen en otros, sin error en ninguno de los dos casos.
biHeight = 32 ; para una imagen de 32 px
biHeight = 64 ; 2 × 32, datos de color más máscara
Algunas herramientas rellenan la máscara y dejan todos los bytes de alfa a cero. Un descodificador lo lee como una imagen totalmente transparente y el icono desaparece; otro recurre a la máscara y lo muestra correctamente. Escribir ambos, de forma coherente, evita toda la discusión.
alpha bytes: all 0x00 mask: all 0x00
alpha bytes: real values mask: set where alpha < 128
Las referencias externas dentro de un SVG se bloquean al rasterizarlo, y nada lo indica: no salta ningún error y el canvas sigue siendo legible. El marcador de imagen rota se cuela sin más dentro del icono. Incrusta el dibujo antes de convertir.
<image href="https://cdn.example.com/logo.png"/>
<image href="data:image/png;base64,iVBORw0KGgo…"/>
00 00 reservado, 01 00 para un icono (02 00 marca un archivo de cursor) y luego un contador de dos bytes. Cada entrada de directorio lleva ancho, alto, tamaño de paleta y un byte reservado —un byte cada uno— seguidos de campos de dos bytes para los planos y la profundidad de bits, y de dos campos de cuatro bytes con la longitud y el desplazamiento de la carga útil. Todo lo que ocupa más de un byte es little-endian.ceil(ancho ÷ 32) × 4 bytes por fila. Una capa de 16 px ocupa por tanto 1128 bytes, la de 48 px 9640 y la de 256 px 270 376, sea cual sea la imagen. Ese coste fijo explica por qué tres sitios sin relación alguna pueden publicar favicons con exactamente la misma longitud en bytes, y por qué aquí solo se ofrece la capa de 256 px cuando la carga útil es PNG.image/vnd.microsoft.icon se registró en la IANA en septiembre de 2003, y la referencia que cita es un artículo de Microsoft de 1995 titulado «Icons in Win32». El RFC 2361, muy citado como la especificación de ICO, se titula en realidad «WAVE and AVI Codec Registries» y no dice absolutamente nada sobre imágenes.magick logo.png -define icon:auto-resize=48,32,16 favicon.ico. Herramientas de Conversión
Convierte números entre binario, hexadecimal, decimal, octal y cualquier base personalizada (2-36) al instante. Gratis, privado, sin registro — todo el procesamiento ocurre en tu navegador.
Herramientas de Conversión
Escribe un entero con signo y obtén de golpe signo-magnitud, complemento a uno, complemento a dos y binario desplazado, de 4 a 64 bits. O pega un patrón de bits o un byte hexadecimal y verás las cinco lecturas.
Herramientas de Conversión
Convierte permisos de archivos Linux entre octal (755, 644) y símbolos rwx. Obtén comandos chmod y detecta ajustes de riesgo como 777 — gratis, directo en tu navegador.
Herramientas de Conversión
Convierta HEX a RGB, HSL, OKLCH, OKLAB y CMYK en su navegador — copie cualquier formato con un clic. Gratis, sin registro, sus colores nunca salen de la página.
Herramientas de Conversión
Convierta colores HEX a CMYK en su navegador. Aproximación ingenua basada en sRGB para vistas previas de imprenta. Gratis, sin registro, sus colores nunca salen de la página.
Herramientas de Conversión
Convierta cualquier color hex a HSL en su navegador — admite hex de 3 dígitos, 6 dígitos y 8 dígitos con alfa. Gratis, instantáneo, sin registro, sus colores nunca salen de la página.