Configurar
Personaliza el diseño de tu favicon.
Escribe texto o elige un emoji, elige una Google Font y exporta SVG, PNG o ICO en el navegador.
Personaliza el diseño de tu favicon.
Haz clic en cualquier ejemplo para cargar su configuración
Descargo de responsabilidad: Los ejemplos son solo para inspiración y pueden parecerse a marcas existentes. No están afiliados ni respaldados por ninguna empresa. logo87.com no infringe ninguna marca registrada y no es responsable del contenido generado por usuarios. Los usuarios son responsables de asegurar que sus creaciones no violen los derechos de propiedad intelectual. Si crees que tus derechos han sido infringidos, por favor contáctanos y lo eliminaremos.
Escribe una letra, una palabra o un emoji en el campo de arriba. Elige una fuente incluida o pega una URL CSS de Google Fonts. El color, el tamaño, el radio, la posición y la rotación actualizan la vista previa al momento. El renderizado ocurre en esta pestaña; el diseño no se sube.
Descarga un SVG, un PNG de 256×256 o «Descargar todo» para un zip de los archivos que navegadores y dispositivos siguen pidiendo. El zip se genera en el navegador a partir de la misma vista previa.
Si el texto se recorta, baja el tamaño de fuente o mueve la posición. Los glifos de emoji cambian según el sistema: revisa la vista previa en el dispositivo que te importa.
No hay registro. Los diseños se quedan en tu dispositivo. Cerrar la pestaña los descarta.
SVG y PNG sueltos para una prueba rápida. «Descargar todo» empaqueta favicon.svg, favicon.ico, apple-touch-icon.png y PNG de 16, 32, 48, 96, 180, 192 y 512.
Doce fuentes incluidas más cualquier Google Font con una URL CSS. Usa los ejemplos de color o define tu propio par.
«Descargar todo» genera estos archivos. No hace falta usarlos todos.
favicon.svg para navegadores modernos; favicon.ico (16×16) para clientes que piden /favicon.ico y no leen el HTML; apple-touch-icon.png (180×180) para la pantalla de inicio de iOS; favicon-16x16.png, favicon-32x32.png y favicon-48x48.png para pestañas y marcadores; favicon-96x96.png para accesos directos; favicon-180x180.png como icono táctil extra; favicon-192x192.png y favicon-512x512.png para el manifiesto de una web app.
Un sitio básico puede publicar favicon.ico y favicon.svg. Añade el PNG de 180 para iOS. Añade 192 y 512 si tienes un manifiesto PWA. Las etiquetas link de cada archivo están en la guía de instalación. Cómo agregar favicons a tu proyecto →
¿Ya tienes el logo en PNG o JPG? Usa PNG a Favicon. Un mapa de bits no se agranda bien: parte de un original al menos tan grande como el tamaño máximo que exportes. PNG a Favicon
¿Ya tienes un logo vectorial? Usa SVG a PNG. El vector escala, así que 512 y 2048 siguen nítidos. Usa 16–512 para iconos del navegador; 2048 es para tiendas o impresión, no para pestañas. SVG a PNG
Una marca de una o dos letras para las pestañas cuando aún no tienes un archivo de logo
PNG de 192×192 y 512×512 para un manifiesto de aplicación web
apple-touch-icon de 180×180 cuando alguien guarda el sitio en iOS
Deja el zip en public/ o static/ y copia las etiquetas link de la guía