Как создать фавиконку
Современный фавикон — это больше, чем изображение размером 16×16. Вот полный рабочий процесс настройки, который выглядит четко на любом браузере, ОС и устройстве.
Что такое фавикон?
Фавикон — это крошечный значок, который браузер показывает на вкладке, панели закладок и в списке истории. На мобильном устройстве это значок на главном экране. На Windows это значок ярлыка.
Современные сайты поддерживают несколько разрешений и форматов, поэтому каждая поверхность получает четкую визуализацию.
Подготовьте исходное изображение
Начните с квадратного изображения размером не менее 512×512 — в идеале SVG с квадратом viewBox. Все, что меньше, будет размываться при уменьшении масштаба.
Избегайте тонких линий и мелкого текста. Они исчезают при размере 16х16.
Создать многоразмерный .ico
Объедините 16, 32, 48, 64, 128 и 256 в одном favicon.ico. Браузеры автоматически выбирают правильный размер.
Наш генератор значков делает это на стороне клиента менее чем за секунду.
Добавьте теги HTML
Перетащите favicon.ico в корень вашего сайта. Затем добавьте значки SVG, apple-touch-icon и манифеста в <head> для полной настройки.
Подтверждайте в каждом браузере
Выполните принудительное обновление в Chrome, Safari, Firefox и Edge. Проверьте панель закладок, вкладку и установку на главном экране.