Un logo de entrada, un ZIP de salida: favicon.ico, PNG para Apple y Android, y el HTML para pegar.
favicon.ico (16, 32 y 48 en un solo archivo), favicon-16/32/48.png, apple-touch-icon.png (180, pantalla de inicio de iOS), icon-192.png e icon-512.png (Android y PWA), site.webmanifest y las líneas para tu head. Todo en un solo ZIP.
Un PNG cuadrado de 512px o más, o un SVG. Un logotipo con texto ancho se centra dejando espacios vacíos a los lados, por lo que un símbolo independiente se conserva mucho mejor a 16px; las letras son ilegibles a ese tamaño.
Los fondos transparentes se ven naturales en pestañas y marcadores, mientras que iOS puede rellenar las áreas transparentes de los iconos de la pantalla de inicio con un color sólido (a menudo negro), por lo que establecer un fondo es más seguro en ese caso. iOS redondea las esquinas por sí mismo, por lo que el apple-touch-icon normalmente se deja cuadrado. iOS, Android y Windows son marcas comerciales de Apple, Google y Microsoft respectivamente; Keepdesk no está afiliado, patrocinado ni respaldado por ellos.
Coloca los archivos en la raíz de tu sitio (/) y pega las líneas de snippet.html dentro de . Si el icono antiguo sigue apareciendo debido a la caché, añade ?v=2 a las URL.
No. El cambio de tamaño, el empaquetado de ICO y la compresión en ZIP se realizan en tu navegador.
Cualquier SVG que el navegador pueda renderizar. Los SVG que hagan referencia a fuentes o imágenes externas pueden perder esas partes.
Los navegadores modernos y las versiones recientes de Windows leen PNG-in-ICO, pero los entornos muy antiguos solo admiten ICO basados en BMP. Conserva favicon-32.png junto a ellos para esos casos.
Obtienes un ZIP que contiene un favicon.ico con múltiples tamaños, varios iconos PNG, un manifiesto web y los fragmentos de enlaces HTML necesarios.
Sí, puedes elegir entre formas cuadradas, redondeadas o circulares para tu icono.
No, no elimina fondos. Usa primero una herramienta de eliminación de fondos si necesitas una imagen de origen transparente.
Sí, puedes aplicar un 0%, 8% o 15% de relleno para asegurarte de que tu icono no se corte en los bordes.