Конвертер SVG в ICO

SVG — лучший исходник для фавикона: каждый размер значка рисуется заново из вектора, а не уменьшается из большой растровой картинки, поэтому версия 16 px остается настолько четкой, насколько позволяет пиксельная сетка.

или перетащите сюда файлы JPG, JPEG, JPE … ·

Макс. 95 MB на файл· До 20 файлов· Удаляются через 30 минут

Вывод

Преобразовать в

Файлы обрабатываются на наших серверах и удаляются через 30 минут.

Качество и цвет

Анимированный исходник

Этот формат хранит только одно изображение. Чтобы сохранить анимацию, выберите GIF или WebP.

Размеры иконки

Многоразмерная иконка содержит несколько разрешений в одном файле; браузеры и операционные системы выбирают нужное.

Изменение размера

Изменить размер изображения

Сохраните исходные размеры или укажите одну сторону — пропорции сохранятся.

Метаданные и цветовой профиль

Автоповорот

Поворачивает изображение по ориентации из EXIF, чтобы оно везде отображалось правильно.

Удалить метаданные

Удаляет GPS-координаты, данные камеры и комментарии. Цветовой профиль можно сохранить отдельно ниже.

Сохранить цветовой профиль

Сохраняет встроенный ICC-профиль, чтобы цвета оставались точными после конвертации.

Цветовое пространство

sRGB подходит для экранов и веба. Для печати сохраните исходное; оттенки серого убирают цвет.

Метка DPI

dpi

Только метаданные; 0 сохраняет исходное значение. Это число читают принтеры и некоторые порталы; размеры в пикселях не меняются.

Как пользоваться инструментом

1
Загрузите логотип в SVG
Используйте знак или монограмму, а не логотип целиком с надписью. Квадратный viewBox даёт самый чистый результат.
2
Оставьте все размеры значка
В поле Размеры иконки по умолчанию выбрано «Все размеры (16–256)»: все разрешения собираются в один файл .ico. Выбирайте один размер, только если программа требует ровно один.
3
Нажмите «Конвертировать в ICO»
Сохраните файл как favicon.ico в корневой папке сайта или укажите его в ярлыке Windows.

Ответ

Как перевести SVG в ICO для фавикона?

Загрузите SVG, оставьте в поле Размеры иконки значение «Все размеры (16–256)» и нажмите Преобразовать в ICO. Вы получите один файл .ico со всеми разрешениями, отрисованными из вектора, с сохранённой прозрачностью.

Конвертер SVG в ICO: почему вектор — правильный исходник

Формат .ico появился ещё в ранних версиях Windows, а соглашение о favicon.ico восходит к Internet Explorer 5 (1999 год), который искал файл с таким именем в корне каждого сайта, добавленного в закладки. ICO — небольшой контейнер: каталог записей, каждая из которых представляет собой отдельный квадратный растр, поэтому в одном файле могут лежать рядом иконка вкладки 16 px и иконка рабочего стола 256 px. В Windows Vista максимум подняли до 256 × 256 и разрешили хранить такие крупные записи в формате PNG.

Поскольку каждая запись — отдельный растр, качество иконки зависит от того, как получен каждый размер. Из PNG любой размер — это уменьшение одних и тех же пикселей. Из SVG любой размер — это новая отрисовка контуров со сглаживанием, рассчитанным под именно эту сетку. В размере 16 × 16 px, где у логотипа всего 256 пикселей, разница заметна.

1:1

16 × 16 px

16 × 16

Вкладки браузера, закладки и списки истории.

1:1

32 × 32 px

32 × 32

Вкладки на экранах с высокой плотностью, ярлыки на панели задач Windows.

1:1

64 × 64 px

64 × 64

Масштабированный вид рабочего стола и закреплённые элементы.

1:1

128 × 128 px

128 × 128

Крупный предпросмотр в файловых менеджерах.

1:1

256 × 256 px

256 × 256

Самая большая запись ICO; огромные значки Проводника.

SVG

Scalable Vector Graphics

SVG — векторный формат на основе XML, стандартизированный W3C в 2001 году. Вместо пикселей он описывает фигуры, контуры и текст, поэтому остаётся чётким при любом размере и для логотипов и иконок обычно весит совсем немного. Он поддерживает прозрачность, стили CSS, скрипты и анимацию, и все браузеры отображают его без дополнений. SVG не подходит для фотографий, а сложные иллюстрации могут медленно отрисовываться. Открывать и редактировать его могут Illustrator, Inkscape, Figma и браузеры.

Сжатие: –
Прозрачность: Да
Анимация: Да
Год появления: 2001 · W3C

Конвертер SVG

ICO

Значок Windows

ICO — формат значков Microsoft, который используется для значков программ Windows и фавиконок сайтов. Один файл .ico может содержать несколько изображений разного размера, например 16×16, 32×32, 48×48 и 256×256 пикселей, чтобы система выбирала наиболее подходящее. Каждое изображение хранится как точечный рисунок или как данные PNG и поддерживает полную альфа-прозрачность. ICO не предназначен для фотографий и крупных иллюстраций. Его читают браузеры, Windows и большинство редакторов значков.

Сжатие: Без потерь
Прозрачность: Да
Анимация: Нет
Год появления: Microsoft

Конвертер ICO

SVG переводят в ICO, потому что логотип существует в виде вектора, а корень сайта, ярлык Windows или настольное приложение по-прежнему ждут один файл .ico с несколькими растровыми размерами.

Подготовьте SVG, прежде чем конвертировать SVG в ICO

Так нужно	Так не нужно
Задайте квадратный viewBox, например `0 0 512 512`.	Не полагайтесь на тончайшие линии, которые пропадают при размере меньше 32 px.
Оставьте небольшой отступ, чтобы знак не касался края иконки.	Не оставляйте широкий логотип с надписью, который превратится в тонкое пятно.
Переведите текст в кривые, чтобы шрифт не изменился.	Не ссылайтесь внутри SVG на внешние изображения или веб-шрифты.
Используйте символ или инициалы, а не полное название.	Не добавляйте белый прямоугольник под логотипом, если не хотите видеть его и на тёмных вкладках.

Конвертер отрисовывает только то, что описано в SVG, поэтому подключённые ресурсы и не встроенные шрифты загрузить нельзя. Figma, Illustrator и Inkscape умеют экспортировать текст в контурах; сделайте так, и буквы везде будут соответствовать вашему бренду.

Когда .ico готов, добавьте PNG 180 px для значков Apple Touch и сам SVG для браузеров, поддерживающих векторные фавиконы; PNG любого размера создаст SVG в PNG. Если исходник — растровый логотип, ту же задачу из пикселей решает PNG в ICO.

Конвертировать SVG в ICO: вопросы и ответы

Зачем конвертировать SVG в ICO, а не делать значок из PNG?

PNG приходится уменьшать под каждый размер иконки, а при уменьшении края размываются. SVG отрисовывается сразу в 16, 32, 64, 128 и 256 px, поэтому в каждом размере края получаются чёткими для своей пиксельной сетки.

Нужен ли браузерам favicon.ico, если на сайте уже есть значок SVG?

Chrome и Firefox читают SVG-фавикон, объявленный тегом link, но многие браузеры, программы для чтения лент и поисковые роботы по умолчанию по-прежнему запрашивают /favicon.ico в корне сайта. Если выложить оба файла, поддержка будет полной.

Что будет, если SVG не квадратный?

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

Сохраняется ли прозрачный фон в ICO?

Да. ICO хранит альфа-канал, поэтому области SVG без заливки остаются прозрачными, и иконка аккуратно смотрится на светлых и тёмных вкладках браузера.

Можно ли конвертировать SVG в ICO для значка программы или папки Windows?

Да, подойдёт тот же файл. Windows берёт изображение 256 px для крупных и огромных значков в Проводнике, а более мелкие записи — для списков и панели задач.

Почему мой значок при 16 px выглядит пустым?

Тонкие линии и мелкий текст при таком размере пропадают. Линия толщиной 2 единицы на монтажной области 512 единиц в иконке 16 px занимает заметно меньше одного пикселя. Сделайте линии толще или возьмите для фавикона более простой знак.

Конвертер SVG в ICO

Конвертер изображений