noderail.io
RU

Генератор фавиконов из изображения

Преобразуйте любое изображение PNG, SVG, JPG или даже букву в полный пакет фавиконов — многоразмерный favicon.ico, PNG-иконки, apple-touch-icon и site.webmanifest, все в одном ZIP. Без загрузки, без регистрации — работает в вашем браузере.

без загрузки .ico + PNG манифест PWA HTML-фрагмент клиентская сторона

Форма и фон

#0D9488
0%
Ваш сайт
Загрузите изображение или введите текст, чтобы предварительно просмотреть ваш фавикон в каждом размере.

ZIP включает favicon.ico, все размеры PNG, apple-touch-icon, PWA и site.webmanifest.

HTML для вставки в <head>

<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">

Почему стоит использовать этот генератор фавиконов

Ничего не загружается

Ваше изображение считывается и преобразуется полностью в вашем браузере. Файлы .ico, PNG и ZIP создаются локально — ваш логотип никогда не попадает на сервер.

Каждый размер, один клик

Одно изображение становится 16, 32, 48, 96, 180, 192 и 512px иконками плюс настоящий многоразмерный favicon.ico — без ручного изменения размеров.

Копировать и вставить HTML

Получите готовый фрагмент <head> и site.webmanifest, чтобы фавикон работал в вкладках браузера, на iOS и как установленное PWA.

SVG остается четким

Векторные SVG растеризуются в полном разрешении для каждого размера, так что ваш фавикон выглядит четким от 16px до 512px значка на главном экране.

Форма и фон

Сделайте его квадратным, закругленным или круглым, установите сплошной или прозрачный фон и добавьте отступ — все в живом предварительном просмотре, который имитирует настоящую вкладку.

Бесплатно и без регистрации

Без аккаунта, без электронной почты, без водяных знаков и без ограничений. Генерируйте столько фавиконов, сколько хотите — бесплатно для личных и коммерческих сайтов.

Как создать фавикон из изображения

Добавьте ваше изображение

Перетащите PNG, SVG, JPG или WebP — квадратный логотип размером около 512×512px дает наилучший результат. Нет изображения? Используйте вкладку Текст.

Выберите форму

Оставьте квадратной или переключитесь на закругленную или круглую, выберите сплошной или прозрачный фон и настройте отступы.

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

Посмотрите ваш фавикон в размерах 16, 32, 48, 180 и 512px рядом с имитированной вкладкой браузера, чтобы знать, что он остается четким, когда он маленький.

Скачайте и установите

Нажмите Загрузить ZIP, поместите файлы в корневую папку вашего сайта и вставьте HTML-фрагмент в ваш <head>.

О фавиконах

Генератор фавиконов — это бесплатный онлайн инструмент, который преобразует изображение — PNG, SVG, JPG или WebP — или короткий текст в маленькую иконку, которая появляется во вкладках браузера, закладках, истории и результатах поиска, все прямо в вашем браузере без загрузки и регистрации. Вместо того чтобы производить одно изображение, он создает полный пакет фавиконов: многоразмерный favicon.ico, отдельные PNG-иконки, Apple touch icon, иконки Android / PWA и site.webmanifest, упакованные в один ZIP с готовым HTML-фрагментом для вставки.

Слово favicon является сокращением от "favorite icon". Современные браузеры больше не полагаются на один фиксированный размер — вкладка на экране с высоким разрешением, закрепленная ярлык, значок на главном экране iOS и установленное прогрессивное веб-приложение запрашивают разные разрешения. Вот почему хороший набор фавиконов варьируется от 16×16px значка вкладки до 512×512px значка PWA. Этот инструмент генерирует каждый из этих размеров из одной загрузки, так что вам никогда не придется открывать редактор изображений или изменять размеры вручную.

Классический файл favicon.ico особенный, потому что он может содержать несколько разрешений внутри одного файла; этот генератор упаковывает версии 16, 32 и 48px в ICO, так что старые браузеры и ярлыки Windows всегда находят размер, который им нравится. PNG-иконки охватывают все более новые: favicon-32x32.png и favicon-16x16.png для вкладок, apple-touch-icon.png размером 180px для iPhone и iPad, и android-chrome-192x192.png и android-chrome-512x512.png, упомянутые в веб-манифесте для Android и устанавливаемых приложений.

Для наилучшего результата начните с квадратного изображения с высоким контрастом — логотип работает гораздо лучше, чем текст, потому что мелкие детали и маленький текст исчезают на 16px. Используйте управление формой, чтобы закруглить углы или обрезать до круга, добавьте цвет фона, если ваш логотип имеет прозрачность, которая исчезнет на белой вкладке, и настройте отступы, чтобы иконка не прижималась к краям. Живой предварительный просмотр показывает иконку в истинном размере вкладки рядом с имитацией браузера, что является самым быстрым способом узнать, читается ли ваш дизайн, когда он маленький.

Поскольку все происходит локально с помощью Canvas API, ваше изображение никогда не покидает ваше устройство — удобно для неразглашенных брендов и конфиденциальных логотипов. Фавиконы, которые вы создаете, бесплатны для личного и коммерческого использования без необходимости указания авторства, и нет ограничений на количество, которое вы можете сгенерировать. Как только у вас есть ZIP, загрузите файлы в корневую директорию вашего сайта, вставьте предоставленные ссылки в <head> каждой страницы и очистите кэш, чтобы увидеть новый значок.

Часто задаваемые вопросы

Этот генератор фавиконов бесплатный и загружается ли мое изображение?

Да, это совершенно бесплатно, без регистрации и водяных знаков. Ваше изображение никогда не загружается — фавикон, файл .ico и ZIP создаются внутри вашего браузера с помощью JavaScript, так что ваш файл никогда не покидает ваше устройство.

Как создать фавикон из PNG или изображения?

Перетащите PNG, JPG, SVG или WebP на инструмент (лучше всего подходит квадратное изображение размером не менее 512×512px), настройте форму, фон и отступы в живом предварительном просмотре, затем нажмите Загрузить ZIP. Вы получите многоразмерный favicon.ico, PNG-иконки и site.webmanifest, готовые для вашего сайта.

Могу ли я создать фавикон из SVG?

Да. Загрузите SVG, и инструмент растеризует его для каждого размера фавикона в вашем браузере, так что иконки останутся четкими. SVG идеально подходит, так как он масштабируется до 512px без размытия перед экспортом в PNG и ICO.

Какие файлы я получаю и куда их помещать?

ZIP содержит favicon.ico, favicon-16x16.png, favicon-32x32.png, favicon-48x48.png, favicon-96x96.png, apple-touch-icon.png (180px), android-chrome-192x192.png, android-chrome-512x512.png и site.webmanifest. Загрузите их в корневую папку вашего сайта и вставьте предоставленный HTML-фрагмент в <head> ваших страниц.

Какой лучший размер фавикона?

Начните с одного большого квадратного изображения, желательно 512×512px. Браузеры используют 16 и 32px в вкладках, устройства Apple используют 180px для значка, а установки Android / PWA используют 192 и 512px. Этот генератор создает каждый размер для вас из одной загрузки, так что вам не нужно ничего изменять вручную.

Могу ли я сделать фавикон из текста или эмодзи?

Да. Переключитесь на вкладку Текст, введите букву, пару символов или эмодзи, выберите цвета текста и фона, и инструмент отобразит это как фавикон в каждом размере — идеально, когда у вас еще нет логотипа.