Какие размеры создаются?

16×16, 32×32, 48×48 (входят в favicon.ico), 180×180 (Apple Touch Icon), 192×192 и 512×512 (иконки PWA).

Сохраняется ли прозрачность?

Да. Альфа-канал PNG сохраняется во всех выходных файлах, включая формат ICO.

В чём разница между favicon.ico и PNG-иконками?

Файл favicon.ico объединяет несколько размеров в одном файле для поддержки старых браузеров, а PNG-иконки используются современными браузерами и PWA. Наличие обоих вариантов обеспечивает максимальную совместимость.

Какое исходное изображение лучше?

Квадратный PNG с прозрачным фоном размером 512×512 пикселей или больше даёт лучший результат при уменьшении до меньших размеров иконок.

Как добавить favicon на мой сайт?

Добавьте <link rel="icon" href="/favicon.ico"> и <link rel="apple-touch-icon" href="/apple-touch-icon.png"> в <head> вашего HTML.

Генератор favicon

Конвертация PNG в favicon.ico и мультиразмерный пакет

Главная · Бесплатные инструменты для изображений

Сжать изображение

Изменить размер

Обрезать изображение

Повернуть изображение

Конвертировать формат

Водяной знак

Редактор изображений

HTML в изображение

Увеличить изображение

Удалить фон

Создатель мемов

Объединить горизонтально

Объединить вертикально

PDF → длинное изображение

Скрыть на изображении

Аннотирование

Конвертер Base64

Сравнение изображений

Эффект дуотон

Эффект зернистости

На главную

Советы и сценарии использования favicon

Сайт — совместимость со всеми браузерами

Чтобы значок корректно отображался в Chrome, Safari, Firefox и Edge, предоставьте и favicon.ico, и PNG-файлы. Загрузите все файлы из созданного ZIP в корень сайта и добавьте соответствующие теги link в head вашего HTML.

PWA / главный экран телефона

Для прогрессивных веб-приложений и ярлыков на главном экране нужны PNG 192×192 и 512×512. Зарегистрируйте оба размера в массиве icons файла manifest.json, чтобы на Android и iOS отображались иконки высокого разрешения.

Айдентика бренда — логотип как иконка

Перед преобразованием в favicon обрежьте из логотипа только символ или знак в квадратный PNG. Делайте дизайн простым — он должен читаться даже при размере 16×16 пикселей.

Генератор favicon

Главная · Бесплатные инструменты для изображений

Как создать favicon

Советы и сценарии использования favicon

Сайт — совместимость со всеми браузерами

PWA / главный экран телефона

Айдентика бренда — логотип как иконка

Похожие инструменты семейства Flexeam

Исследуйте вселенную Flexeam

Часто задаваемые вопросы