Перейти к содержимому
Бесплатный инструментDesign

Создавайте каждый размер значка, необходимый вашему сайту, из одного изображения.

Загрузите логотип или значок, и инструмент выведет значки всех размеров, которые требуются современным браузерам, операционным системам и манифестам PWA — от классического ICO 16 x 16 до PNG 512 x 512 для домашних экранов Android. Загрузите готовый к развертыванию пакет с включенным в него фрагментом HTML.

Используйте этот инструмент бесплатно

Browser tool

Favicon generator

Runs locally in your browser. The selected image is not uploaded by this tool.

JPEG, PNG, and WebP are supported by default. Specialized converters restrict the file picker to their required input format.

Choose an image to start.

Как использовать

1

Загрузите свое изображение

Загрузите в генератор файл PNG, SVG, JPEG или WebP. Квадратные изображения размером 512 пикселей или больше дают наиболее четкие результаты.

2

Обрезать и настроить

Перетащите маркеры обрезки, чтобы изолировать область значка. Добавьте отступы, если значку нужна передышка. Установите прозрачный или однотонный фон.

3

Предварительный просмотр всех размеров

Инструмент отображает все целевые размеры одновременно, поэтому вы можете убедиться, что значок узнаваем при разрешении 16 пикселей и выглядит четким при разрешении 512 пикселей.

4

Скачать пакет

Загрузите ZIP-архив, содержащий все файлы значков, а также фрагмент HTML, который вы можете вставить в тег <head> вашего сайта, чтобы правильно ссылаться на каждый значок.

Функции

1

Полный охват размеров

Генерирует 16 x 16, 32 x 32 и 48 x 48 для традиционных браузеров; Значок Apple Touch 180 x 180 для iOS; 192 x 192 и 512 x 512 для манифестов Android PWA. Любой распространенный размер за один проход.

2

Вывод ICO и PNG

Пакет включает в себя файл .ico с разными разрешениями (содержащий слои размером 16, 32 и 48 пикселей) и отдельные файлы PNG для каждого размера. Оба формата готовы для прямого использования в заголовочных тегах HTML.

3

Редактор обрезки и заполнения

Отрегулируйте область обрезки, чтобы изолировать часть изображения со значком. Добавьте отступы, чтобы значок не касался краев квадрата значка, что улучшает читаемость при небольших размерах.

4

Фоновый контроль

Оставьте прозрачный фон для современных браузеров или установите сплошной цвет заливки для значков Apple Touch (которые не поддерживают прозрачность). Просмотрите оба режима перед загрузкой.

After this task

After this free tool, open Background Eraser for the next AI editing workflow.

Continue with Background Eraser

Технические характеристики

Выходные размеры (пикселей)16, 32, 48, 180, 192, 512
Выходные форматыICO (многослойный), PNG
Форматы вводаPNG, SVG, JPEG, WebP
Рекомендуемый ввод512 x 512 пикселей или больше, квадратный
Иконка Apple Touch180 x 180 пикселей с дополнительным сплошным фоном
ОбработкаКлиентская сторона (без загрузки)

Related Magic Eraser Tools

Общие вопросы

С какого размера изображения следует начать?

+

Начните с квадратного изображения размером не менее 512 x 512 пикселей. Генератор уменьшает масштаб по сравнению с этим эталоном, поэтому источник с высоким разрешением гарантирует четкость каждого меньшего размера. Файлы SVG работают лучше всего, поскольку они масштабируются без потери качества.

Нужны ли мне все шесть размеров?

+

Да, для максимальной совместимости. ICO размером 16 и 32 пикселя подходят для устаревших браузеров, PNG размером 180 пикселей требуется для закладок iOS Safari, а PNG 192/512 пикселей необходимы для приглашений на установку Android PWA и заставок.

Как добавить значки на мой сайт?

+

Пакет загрузки включает в себя фрагмент HTML. Вставьте его в раздел <head> вашего сайта. Он ссылается на файл ICO для браузеров и файлы PNG для устройств Apple и Android. Большинство фреймворков также поддерживают размещение favicon.ico в корневом каталоге.

Логотип слишком сложен для крошечного значка?

Используйте Background Eraser, чтобы изолировать основной символ от полного логотипа, а затем введите чистый значок в генератор значков. Более простая форма лучше читается при размере 16 пикселей.

Попробуйте бесплатно

More free tools

Explore our other limited free edits after sign-in photo and image tools.

Создавайте красивые градиенты и экспортируйте их в формате CSS или изображений.

Создавайте линейные, радиальные и конические градиенты с несколькими цветовыми точками. Скопируйте код CSS или загрузите изображение в формате PNG. Никакой регистрации не требуется.

Преобразование цветовых кодов между всеми основными форматами

Преобразуйте цвета между именованными форматами HEX, RGB, HSL, HSB, CMYK и CSS. Просмотрите предварительный просмотр в реальном времени, скопируйте любое значение и экспортируйте карту цветов. Никакой регистрации не требуется.

Преобразование HEX-кодов цветов в RGB и обратно.

Преобразуйте цветовые коды HEX в значения RGB и наоборот. Предварительный просмотр в реальном времени, копирование одним щелчком мыши и вывод фрагмента CSS. Регистрация не требуется — работает в вашем браузере.

Извлекайте точные цвета из любого изображения

Выберите любой цвет из загруженного изображения и мгновенно получите его коды HEX, RGB и HSL. Создавайте палитры из фотографий для веб-дизайна, брендинга и иллюстраций.

Извлеките цветовую палитру из любой фотографии

Загрузите фотографию и извлеките 5–10 доминирующих цветов с помощью кодов HEX, RGB и HSL. Копируйте образцы, экспортируйте их как переменные ASE или CSS. Никакой регистрации не требуется.

Создавайте настраиваемые QR-коды для любого контента

Создавайте QR-коды для URL-адресов, текста, учетных данных Wi-Fi и визитных карточек. Настройте цвета, добавьте центральный логотип и загрузите его в формате PNG или SVG. Никакой регистрации не требуется.