Генератор фавиконок
Превратите логотип или изображение в готовый набор фавиконок. Проверьте маленькие значки, задайте отступы и скачайте ICO и PNG с понятными именами, веб-манифестом и HTML-тегами.
Ваш файл
Почему этот инструмент
- Без ограничения размера
- Ничего не загружается
- Без регистрации
Фавикон помогает узнать ваш сайт во вкладках браузера, закладках, ярлыках и выдаче поисковиков. Этот бесплатный генератор создаёт согласованный набор иконок из PNG, JPG, WebP или HEIC — полностью в браузере.
Используйте простой знак с сильным контрастом. Мелкие буквы и детальные фото пропадают в 16 × 16 пикселях; проверьте предпросмотр в реальном размере до экспорта.
Как сделать фавикон из изображения
Выберите логотип
Перетащите изображение в любое место страницы или выберите файл. Хорошо подходит квадратный исходник от 512 × 512 пикселей.
Проверьте предпросмотр
Покажите изображение целиком или обрежьте до квадрата. Настройте отступ и цвет фона для иконок Apple и маскируемой иконки.
Скачайте и установите
Создайте набор, распакуйте ZIP и загрузите иконки и манифест на сайт. Скопируйте готовые теги link в раздел head.
Один набор для вкладок и главных экранов
ICO содержит изображения 16, 32 и 48 пикселей. Отдельные PNG покрывают 16, 32, 48, 96, 180, 192 и 512 пикселей. Иконка Apple Touch получает непрозрачный фон, а отдельная маскируемая иконка держит весь исходник внутри безопасной зоны.
Фавикон для Яндекса и Google
По справке Яндекс Вебмастера, Яндекс принимает фавикон размером 16 × 16, 32 × 32 или 120 × 120 пикселей в форматах SVG, ICO, GIF, JPEG, PNG или BMP, а для более чёткого показа в своих сервисах рекомендует SVG или 120 × 120. Файлы 16 и 32 из этого набора подходят. Размеров 120 × 120 и SVG в наборе нет: сделайте PNG 120 × 120 из того же логотипа через изменение размера или векторную версию через PNG в SVG и добавьте для неё отдельный тег link.
Google рекомендует квадратный фавикон больше 48 × 48 пикселей — для этого в наборе есть PNG 96 × 96. Ни Яндекс, ни Google не показывают новый фавикон сразу: им нужно заново обойти сайт, а показ в выдаче не гарантирован.
Как подготовить понятный знак
Для логотипа на прозрачном фоне начните с PNG или сначала удалите фон. Чтобы уточнить объект, обрежьте изображение. Увеличение крошечного исходника не вернёт потерянные детали. Если нужен только свой файл ICO, используйте PNG в ICO.
Установка и решение проблем
Готовый HTML рассчитан на файлы в корне сайта. Записи об иконках объединяйте с существующим манифестом, а не заменяйте его. Проверьте, что каждая иконка открывается по своему адресу, удалите старые конфликтующие теги и обновите закэшированные иконки. В WordPress, Tilda и других конструкторах фавикон часто задаётся в настройках сайта — тогда загрузите туда подходящий файл из набора.
Размеры и имена файлов фавиконок
В ZIP 12 файлов. Вот иконки и их назначение.
| Файл | Размер в пикселях | Назначение |
|---|---|---|
| favicon.ico | 16 / 32 / 48 | Вкладки браузера и совместимость с ICO |
| favicon-16x16.png · favicon-32x32.png · favicon-48x48.png | 16 / 32 / 48 | Маленькие PNG-варианты |
| favicon-96x96.png | 96 × 96 | Крупная иконка для браузера и поиска |
| apple-touch-icon.png | 180 × 180 | Ярлыки на iPhone и iPad |
| android-chrome-192x192.png · android-chrome-512x512.png | 192 / 512 | Иконки Android и веб-приложений |
| maskable-icon-512x512.png | 512 × 512 | Адаптивная иконка с безопасной зоной |
Для сайтов любого размера
Сайты компаний
Один узнаваемый логотип во вкладках и сохранённых ярлыках.
Блоги и портфолио
Простая иконка сайта без установки графического редактора.
Веб-приложения
Иконки для манифеста; остальные требования к установке приложения проверьте отдельно.
