Guía de apple-touch-icon
Cuando alguien añade tu sitio a la pantalla de inicio en iOS, Safari utiliza apple-touch-icon — no favicon.ico. Publica un PNG de 180×180 (o un cuadrado mayor que se reduzca de forma limpia) y enlázalo en tu <head>.
Comprueba favicons en cualquier sitio
Instala la extensión FetchFavicon para Chrome para extraer, previsualizar y validar favicons al instante.
Apple ya no aplica máscara en el iOS moderno para clips web como lo hace con las apps nativas, pero tu icono debe seguir siendo cuadrado con márgenes seguros: deja el logo un ~10 % hacia dentro para que las esquinas redondeadas nunca recorten el diseño.
Usa <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">. Un solo archivo de 180×180 cubre todos los iPhone actuales; las entradas opcionales de 152×152 y 167×167 mejoran la visualización en iPad antiguos.
Cómo funciona
- 1
Exporta un PNG de 180×180
Desde nuestro generador de favicons o redimensionador de imágenes.
- 2
Súbelo a la raíz del sitio
/apple-touch-icon.png junto a favicon.ico.
- 3
Añade la etiqueta link
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> en <head>.
Pruébalo ahora
Genera el apple-touch-icon
Generador de FaviconPreguntas frecuentes
¿Qué tamaño tiene el apple-touch-icon?+
180×180 píxeles para los iPhone actuales. Expórtalo desde un master de 512×512 o 1024×1024.
¿PNG o ICO para iOS?+
Solo PNG. iOS ignora .ico para los iconos de pantalla de inicio.
¿Sigo necesitando favicon.ico?+
Sí — las pestañas y otros navegadores aún usan .ico. El apple-touch-icon es complementario.
Herramientas relacionadas
Generador de Favicon
Genera un pack completo de favicons (ICO + PNGs) para cada dispositivo y navegador.
Redimensionar imagen
Cambia el tamaño de imágenes PNG, JPG y WebP a dimensiones exactas.
Convertidor de PNG a ICO
Convertidor online gratuito de PNG a ICO para iconos de Windows, apps y favicons de sitios web.