a11y.skipToMainContent
1

Генератор Favicon

Создайте полный готовый к производству пакет favicon прямо из вашего браузера. Загрузите любое изображение или наберите букву или эмодзи на цветном фоне, затем загрузите favicon.ico, все браузеры размером с PNG и PWA ожидают, сайт. файл webmanifest и точный фрагмент HTML для вставки в голову страницы — без сервера, без регистрации.

Drag an image here, paste from clipboard (Ctrl+V), or

Was this tool helpful?
Send Image to:
Advertisement

How to use Favicon Generator

  1. Выберите источник: загрузите изображение, перетащив его в зону падения или щелкнув браузер, или переключитесь в режим Letter/emoji и введите символ с выбранным фоном и цветами текста.
  2. Для загрузки изображения инструмент автоматически генерирует главный холст 512px; для клика в текстовом режиме генерировать из текста для рендеринга.
  3. Загрузите каждый файл по отдельности — favicon.ico, размеры PNG и сайт. webmanifest - затем скопируйте фрагмент HTML и вставьте его между открыванием и закрытием теги головы вашей страницы.

Что такое имя?

Современные веб-сайты требуют больше, чем один favicon.ico. Браузеры, домашние экраны iOS и пусковые установки Android PWA ожидают разные размеры и форматы файлов: 16×32×48-разрешение .ico для классических браузеров, 180×180 PNG для Apple Touch Icon, 192×192 и 512×512 PNG, объявленные в манифесте веб-приложения, плюс правильная ссылка и метатеги, чтобы связать все это вместе. Этот инструмент генерирует полный набор в один шаг.

Режим буквы / эмодзи удобен, когда вам нужен быстрый фирменный заполнитель - введите один символ, выберите фон и цвета текста, и инструмент отображает его в 512px с помощью рендерера шрифта браузера, прежде чем масштабироваться до каждого необходимого размера. Результатом является чистый, разборчивый значок даже при 16×16.

Все работает на стороне клиента, используя API Canvas и алгоритм кодирования ICO. Ваши изображения никогда не покидают ваше устройство, и нет ограничений размера файла за пределами памяти вашего браузера

Advertisement

FAQ

Какие файлы содержит пакет favicon?
Генератор производит: favicon.ico (содержащий кадры 16, 32 и 48px PNG), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180×180), favicon-192x192.png, favicon-512x512.png, site.webmanifest и фрагмент заголовка HTML, связывающий их все.
Какой размер изображения я должен загрузить для достижения наилучших результатов?
Квадратное изображение не менее 512×512 пикселей дает самые резкие шкалы при каждом размере. Неквадратные изображения автоматически центрированы. Файлы SVG также поддерживаются, хотя они растеризованы на холст 512px внутри.
Могу ли я использовать эмодзи в качестве фавикона?
Да — переключитесь в режим Letter/emoji, введите свои emoji во ввод, выберите фон и цвета текста и нажмите «Сгенерировать из текста». Эмодзи отображается вашим движком шрифта ОС, поэтому внешний вид может немного отличаться на разных платформах, но он будет узнаваем во всех размерах значков.

Related tools

Author

AR
Aisha Rahmani"The Visual Storyteller"

Design Technologist & Media Specialist

Aisha bridges the gap between pixels and code. With expertise in image processing, SVG optimization, and video compression, she helps creators, designers, and marketers prepare media that looks great and loads fast. She has spoken at design conferences about accessible visual content and has helped agencies reduce page-weight budgets by up to 60 percent without sacrificing creative quality.

← Back to Image Tools · All tags

Last updated:

Advertisement