Створіть повний пакет фавіконів із логотипа, шрифтової іконки або монограми — favicon.ico, сучасні PNG, іконка Apple touch, іконки PWA, вебманіфест та HTML-фрагмент.

Завантажте логотип, виберіть шрифтову іконку або введіть монограму — ми створимо всі фавікони, потрібні сучасному сайту: від класичного favicon.ico до іконки Apple touch, іконок PWA та готового до вставлення HTML-фрагмента.

Перетягніть сюди PNG або натисніть для завантаження
Рекомендовано прозорий PNG · також приймаються JPG / WebP
64%
Колір тла
0%
Використовується інтерфейсом браузера та маніфестом PWA.
Ваш сайт
example.com
Закладка · 32px
Apple touch · 180px
PWA · 512px

Ваш пакет фавіконів готовий
Завантаження ZIP розпочалося. Розпакуйте його в корінь вашого сайту та вставте HTML-фрагмент у ваш <head>.

Про Генератор фавіконів

Генератор фавіконок створює всі іконки, потрібні сучасному сайту, з одного джерела: завантажте логотип PNG, оберіть шрифтову іконку або введіть монограму. Пакет включає класичний favicon.ico (16, 32 та 48 px), сучасні PNG-фавіконки, 180-піксельну іконку Apple touch, PWA-іконки 192 та 512 px, файл site.webmanifest і фрагмент HTML для секції head.

Стилізація виконується в самому інструменті: оберіть колір фону або залиште прозорість, обріжте до квадрата, заокругленої форми чи кола, налаштуйте відступи та розмір зображення, встановіть колір теми, який використовується інтерфейсом браузера та маніфестом PWA. Живий перегляд показує вашу іконку в реальних контекстах — 16-піксельній вкладці браузера, закладці, плитці Apple touch і іконці PWA.

Усе рендериться на полотні у вашому браузері, а "Генерувати" збирає весь пакет у ZIP-архів із README. Встановлення займає два кроки: розпакуйте в корінь вашого сайту та вставте наданий фрагмент у ваш <head>.

Як використовувати Генератор фавіконів

  1. Оберіть джерело: завантажте логотип PNG, оберіть шрифтову іконку або введіть монограму.
  2. Оформіть її — колір фону чи прозорість, форма, відступи та розмір зображення.
  3. Заповніть назву сайту, коротку назву та колір теми для маніфесту PWA.
  4. Перевірте попередній перегляд: вкладка браузера, закладка, Apple touch і контексти PWA.
  5. Натисніть "Генерувати фавіконки" і розпакуйте пакет у корінь вашого сайту.
  6. Вставте фрагмент HTML з пакета у <head> вашої сторінки.

Часті запитання

Так — повний пакет, включно з .ico, усіма розмірами PNG, маніфестом і фрагментом HTML, безкоштовний для генерації та завантаження.

favicon.ico з шарами 16, 32 та 48 px, сучасні PNG-фавіконки, 180-піксельна apple-touch-icon, PWA-іконки 192 та 512 px, файл site.webmanifest, готовий до вставки фрагмент HTML та README з кроками встановлення.

Так. Браузери та краулери досі запитують /favicon.ico як резервний варіант, а старіші клієнти покладаються на нього. Пакет постачає його разом із сучасними PNG-посиланнями, тож кожен відвідувач отримує чітку іконку.

Розпакуйте архів у корінь вашого сайту так, щоб файли опинилися в корені домену, потім вставте наданий фрагмент HTML у <head> ваших сторінок. README у ZIP-архіві повторює ці кроки.

Він записується в маніфест і мета-теги, забарвлюючи інтерфейс браузера на мобільних пристроях та заставку і панель заголовка встановленого PWA так, щоб вони відповідали вашому бренду.

Так. Введіть монограму з однієї-двох літер, оберіть шрифт і кольори, або оберіть гліф із бібліотеки шрифтових іконок — генератор відрендерить його в кожному розмірі так само, як завантажений логотип.

Поділитися

Популярні запити
генератор favicon створення favicon.ico створити favicon онлайн apple touch icon генератор іконок pwa favicon з логотипу
Потрібна допомога?
Виникла проблема з цим інструментом? Повідомте нас.
Повідомити про проблему

Додайте цей безкоштовний інструмент на власний вебсайт — скопіюйте та вставте код нижче.