Собрать набор фавиконов из одной картинки
Положите знак. Скачайте ICO, PNG нескольких размеров и apple-touch-icon, а также фрагмент кода для HTML. Файл остаётся на этом устройстве.
- Быстро
- На 100% приватно
- Всегда бесплатно
- Любой браузер
Drop images anywhere on this page
Один PNG, JPG, SVG или WebP. Он остаётся на этом устройстве.
Когда собирать набор фавиконов
Инструмент нужен, когда сайту всё ещё требуются привычный favicon.ico и значки PNG, которые реально показывают телефон и браузер. Хватает одной исходной картинки. Чище всего выходит квадратный PNG или знак в SVG. Картинка вписывается в квадратный холст. Широкий знак сохраняет свои пропорции, по бокам остаётся поле.
Скачиваемый PNG по умолчанию имеет прозрачный фон. ICO кладёт за знаком белый или выбранный вами сплошной цвет. Старый интерфейс вкладки часто ждёт непрозрачную иконку. Правку слоёв делают до этого шага. Если сначала нужно кадрировать или добавить текст, сделайте это в Photasium, затем положите результат сюда.
В zip лежат favicon.ico (16 и 32), PNG 16, 32, 180, 192 и 512, а также apple-touch-icon на 180. Код вставляется в head документа. Размеры 192 и 512 по желанию: их обычно ищет манифест веб-приложения. Эти имена можно прямо переписать в manifest.json.
После скачивания, если PNG всё ещё велик, его можно сжать. Фавикон держите маленьким. Картинку для публикации берите здесь: изображение OG 1200×630.
Обработка идёт в этом браузере. Аккаунта нет, файл остаётся на устройстве. После закрытия вкладки знак исчезает из инструмента.
Как сделать
- Положите один файл PNG, JPG, SVG или WebP. Он остаётся на этом устройстве.
- Оставьте PNG прозрачным или выберите сплошной цвет. ICO возьмёт белый или этот цвет.
- Соберите набор, скопируйте код HTML и скачайте zip.
Подсказки
- Квадратный знак выходит чётче всего. У широкого текстового знака по бокам останется поле.
- Для фавикона берите простой знак. Фото в 4000 пикселей для иконки вкладки слишком подробно.
- ICO упаковывает изображения PNG 16 и 32. Новые браузеры также берут ссылку на PNG.