Генератор favicon

Создайте favicon из любого изображения

Favicon — это маленькая иконка, которая отображается на вкладках браузера, в закладках и на главных экранах телефонов. Этот генератор берёт одно квадратное изображение и создаёт чёткие PNG-иконки всех размеров, нужных современным сайтам, — от иконки вкладки 16×16 до иконки 512×512 для прогрессивных веб-приложений — полностью в вашем браузере.

Перетащите логотип, и вы увидите живой предпросмотр каждого размера, готовый к отдельной загрузке. Мы также генерируем точные теги <link>, которые нужно вставить в <head> вашей страницы, поэтому подключение favicon занимает считанные секунды.

Советы для чётких иконок

Начните с квадратного изображения не менее 512×512 пикселей. Выразительные простые формы с высоким контрастом остаются узнаваемыми при уменьшении до 16 пикселей, тогда как мелкие детали и маленький текст превращаются в пятно. Проверьте предпросмотр 16×16 — если вы всё ещё понимаете, что это, у вас отличная favicon.

Какой размер где используется

• 16×16 и 32×32 — вкладки браузера, закладки и адресные строки.
• 48×48 и 64×64 — ярлыки на рабочем столе и некоторые иконки в результатах поиска и списках сайтов.
• 128×128 — более крупные записи в магазинах и каталогах расширений.
• 180×180 — Apple touch icon, которая используется, когда страницу добавляют на главный экран iPhone или iPad.
• 192×192 и 512×512 — иконки главного экрана Android и прогрессивных веб-приложений, указанные в манифесте веб-приложения.

Полезно знать

Каждое изображение масштабируется прямо до квадрата, поэтому используйте квадратный источник; прямоугольный логотип будет растянут. Прозрачность сохраняется в файлах PNG, но iOS плохо отображает прозрачные touch-иконки, поэтому сплошной фон — более безопасный выбор для версии 180×180. Файлы называются, например, favicon-32x32.png, что соответствует сгенерированному фрагменту, так что сохраняйте эти имена, когда копируете их в корень сайта. Эта страница создаёт только файлы PNG; если вам нужен ещё и классический favicon.ico, создайте его из исходного изображения с помощью конвертера PNG в ICO.

Добавление иконок на ваш сайт

Скачайте нужные размеры, поместите их в публичный корень сайта и вставьте сгенерированные теги <link> в <head>. Если вы создаёте манифест веб-приложения, укажите в его списке иконок файлы 192×192 и 512×512. После развёртывания поисковым системам и браузерам может потребоваться время, чтобы обновить кэшированную favicon, поэтому проверяйте в приватном окне и не беспокойтесь, если старая иконка задержится на день-два.