Guías y Tutoriales de Favicon
Aprenda todo sobre favicons: tamaños, formatos, guías de implementación y consejos de solución de problemas.
Guía de tamaños de favicon: todas las dimensiones que necesitas en 2026
La referencia completa de tamaños de favicon — 16x16, 32x32, 180x180, 192x192, 512x512 — para qué sirve cada uno y qué plataformas lo requieren.
Cómo añadir un favicon en Next.js (App Router y Pages Router)
Guía paso a paso para añadir un favicon a una app de Next.js, cubriendo la convención de archivos del App Router, el enfoque del head en el Pages Router y los errores comunes.
¿El favicon no aparece? Así lo arreglas (10 causas)
La lista de verificación definitiva para favicons rotos — caché del navegador, rutas incorrectas, tipos MIME y problemas específicos de frameworks.
Favicons SVG vs PNG vs ICO: ¿cuál deberías usar?
Una comparación práctica de los formatos de favicon — compatibilidad, tamaño de archivo, modo oscuro y cuándo usar cada uno.
Cómo añadir un favicon en HTML (la guía completa de 2026)
La etiqueta <link rel="icon"> exacta, dónde colocar tus archivos de favicon y HTML listo para copiar y pegar que cubre ICO, PNG, SVG, Apple touch icon y web manifest.
Convertir PNG a favicon: conversor online gratuito de ICO (2026)
Convierte un PNG en un favicon.ico multirresolución más todos los tamaños PNG. Cómo funciona la conversión, por qué importa la transparencia y cómo evitar la borrosidad.
Apple touch icon: guía de tamaño, etiqueta y configuración para iOS (2026)
Qué es el apple-touch-icon, el requisito exacto de 180x180, la etiqueta link correcta y cómo corregir los fallos comunes de la auditoría de Lighthouse.
Cómo añadir un favicon a WordPress (guía del Site Icon 2026)
Dos formas de añadir un favicon a WordPress: la subida nativa del Site Icon en el Personalizador y el método manual de etiquetas link para temas personalizados.
Cómo añadir un favicon en React (CRA y Vite, 2026)
Añade un favicon a una app de React con Create React App o Vite — ubicaciones de archivos, ediciones de index.html, preferencia por SVG y cambio de favicon en tiempo de ejecución.
Cómo añadir un favicon a tu tienda Shopify (guía 2026)
Sube un favicon a Shopify mediante los ajustes del tema, el tamaño PNG requerido, el autoescalado de Shopify y cómo arreglar problemas del favicon en el checkout.
Favicon en modo oscuro: iconos adaptativos para claro y oscuro (2026)
Cómo hacer que tu favicon se adapte al modo oscuro usando media queries SVG, etiquetas meta theme-color duales y un fallback JS para navegadores antiguos.
¿El favicon en modo oscuro no funciona en Safari? El bug de WebKit y sus soluciones
Safari ignora prefers-color-scheme dentro de los favicons SVG — bug de WebKit #309949. Cómo confirmar el bug y las soluciones alternativas que realmente funcionan.
Por qué tu favicon se ve borroso (y la solución de escalado progresivo)
La reducción en un solo paso con canvas destruye el detalle a 16×16. Por qué la mayoría de los generadores producen iconos borrosos y cómo el halving progresivo lo corrige.
¿Nuevo en favicons?
Comience con la guía completa: qué es un favicon, todos los tamaños que necesita y cómo añadir uno a cualquier sitio web.
Leer ¿Qué es un Favicon?