Генератор apple-touch-icon

Створіть apple-touch-icon 180×180, який iOS використовує для закладок на головному екрані, — а разом із ним і повний набір favicon — локально у вашому браузері. Нічого не завантажується.

Конфіденційність понад усе: кожне зображення обробляється локально у вашому браузері. Нічого не завантажується, не зберігається й не передається на жоден сервер.

Піктограма, яку iOS кладе на головний екран

Коли хтось додає ваш сайт на головний екран iPhone чи iPad, iOS шукає apple-touch-icon 180×180; без нього вона відкочується до розмитого скріншота. Цей генератор рендерить саме цей розмір із вашого зображення — із суцільним тлом, бо apple-touch-icon не має бути прозорим, — і додає його до завантаження разом із favicon.ico та піктограмами Android.

Один експорт — усі платформи

Замість того щоб вручну обрізати окремий файл під кожен пристрій, згенеруйте весь набір за раз: apple-touch-icon для iOS, PNG на 192 і 512px для Android і PWA та favicon.ico для десктопних браузерів, плюс HTML-фрагмент, щоб на них послатися. Усе працює у вашому браузері, тож графіка вашого бренду ніколи не покидає пристрій.

Поширені запитання

Чи надсилається моє зображення на сервер для створення фавікона?
Ні. favicon.ico, іконки PNG і маніфест генеруються локально у вашому браузері за допомогою Canvas API. Ваше зображення ніколи не залишає пристрій.
Які розміри та файли я отримаю?
Багатороздільний favicon.ico (16, 32 і 48px), іконки PNG розміром 16, 32, 48, 180 (apple-touch-icon), 192 і 512px, site.webmanifest та фрагмент HTML для вставлення у ваш <head>.
Чи можна конвертувати PNG або SVG в ICO?
Так. Додайте PNG, JPG, SVG або WebP і завантажте справжній favicon.ico. Логотипи SVG спершу растеризуються локально у високій роздільній здатності.
Яке зображення підходить найкраще?
Квадратне зображення з простим контрастним логотипом. Неквадратні зображення обрізаються по центру; використовуйте налаштування відступу та форми, щоб скадрувати його так, як вам потрібно.
Як встановити фавікон?
Розпакуйте пакет у кореневу теку свого сайту та вставте наданий фрагмент HTML у <head> ваших сторінок. favicon.ico більшість браузерів підхоплюють автоматично.