Cómo funcionan los formatos de favicon
Entender cómo funciona cada formato te ayuda a resolver el inevitable problema de «mi favicon no se muestra».
El contenedor .ico
Un archivo .ico es una cabecera seguida de una o más entradas de imagen. Cada entrada puede ser BMP o PNG, y cada una tiene un ancho, alto y profundidad de bits.
Los navegadores leen el directorio, eligen la entrada que coincide con el tamaño solicitado y decodifican solo esa.
PNG dentro de .ico
Para tamaños de 64×64 en adelante, la compresión PNG reduce el peso del archivo entre 5 y 10 veces sin pérdida visual. Los generadores modernos (incluido el nuestro) aplican esto de forma automática.
Favicons SVG
Un favicon SVG es un archivo SVG normal. Los navegadores lo renderizan como cualquier otro SVG, y el bloque <style> puede adaptar colores según prefers-color-scheme.
Cómo eligen los navegadores
Si publicas varias etiquetas <link rel="icon">, los navegadores eligen la que mejor encaja con la superficie (pestaña, marcador o instalación). Se prefiere SVG cuando hay soporte; .ico es el respaldo por defecto.