Конвертер SVG в іконку

Q: Чим ця сторінка відрізняється від SVG в ICO?

[SVG у ICO](/svg-to-ico) зосереджений на одному файлі .ico для фавіконок і Windows. Ця сторінка охоплює всі місця, де потрібна іконка, зокрема ICNS для macOS і PNG фіксованих розмірів, яких вимагають Android, iOS та магазини застосунків.

Один векторний логотип може стати джерелом для всіх ваших іконок: favicon, ярлика Windows, програми для Mac і значків запуску на телефонах. Ця сторінка за замовчуванням створює багаторозмірний ICO, а для інших платформ ви можете перемкнутися на ICNS або PNG.

або перетягніть Файли JPG, JPEG, JPE … сюди ·

До 95 МБ на файл· До 20 файлів· Видаляються через 30 хв

Результат

Конвертувати в

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

Якість і колір

Анімований файл

Цей формат містить одне зображення. Оберіть вихідний формат GIF або WebP, якщо хочете зберегти анімацію.

Розміри іконок

Багаторозмірна іконка містить кілька роздільностей в одному файлі; браузери та операційні системи обирають потрібну.

Розмір результату

Змінити розмір результату

Залиште початкові розміри або введіть одну сторону — пропорції збережуться.

Метадані та колірний профіль

Автоорієнтація

Повертає зображення за орієнтацією, збереженою в EXIF, щоб воно скрізь відображалося правильно.

Видалити метадані

Видаляє GPS-координати, дані камери та коментарі. Профіль кольору можна зберегти окремо нижче.

Зберегти колірний профіль

Зберігає вбудований профіль ICC, щоб кольори залишалися точними після конвертації.

Колірний простір

sRGB підходить для екранів і вебу. Для друку залиште оригінальний; відтінки сірого відкидають колір.

Тег DPI

dpi

Лише метадані, 0 зберігає початкове значення. Принтери та деякі портали читають це число; воно не змінює піксельні розміри.

Як користуватися цим інструментом

1
Виберіть квадратний SVG
Додайте SVG вашого логотипа, бажано з квадратним viewBox. Можна додати до 20 файлів одночасно, наприклад світлий і темний варіанти.
2
Виберіть формат іконки
За замовчуванням вибрано ICO із значенням «Усі розміри (16–256)» в полі Розміри іконок. Виберіть ICNS у списку Конвертувати в для macOS або PNG із шириною в полі Змінити розмір результату для іконки телефона чи магазину застосунків.
3
Конвертуйте й розмістіть файли
Натисніть Конвертувати в ICO (назва кнопки залежить від вибраного формату), завантажте результат і розмістіть кожен файл там, де його очікує відповідна платформа.

Єдиного формату іконок не існує. Windows і браузери використовують ICO, macOS — ICNS, а телефони — набори PNG. Якщо почати з SVG, кожна іконка малюється заново з вектора і лишається чіткою в будь-якому розмірі.

SVG в іконку: один вектор, три типи файлів іконок

Файл іконки — це контейнер із невеликих растрових зображень, а не вектор. Операційна система вибирає зображення, найближче до потрібного розміру, тому в хорошої іконки їх кілька, і кожне відмальоване під свою сітку.

Пресет ICO на цій сторінці створює один файл з усіма розмірами від 16 до 256 px, що підходить для favicon.ico і ярликів Windows. Змініть Конвертувати в на ICNS для контейнера іконок Apple або на PNG для окремих розмірів, яких вимагають Android, iOS і магазини застосунків.

У таблиці наведено вимоги, які великі платформи публікують для своїх іконок.

Файли іконок, які потрібні кожній платформі
Організація	Вимога	Джерело
Робочий стіл і панель завдань Windows	ICO з кількома розмірами, зокрема 16, 32, 48 і 256 px	—
Фавіконка сайту	favicon.ico в корені сайту з розмірами 16, 32 і 48 px; PNG 180 × 180 px для apple-touch-icon	—
Іконка застосунку macOS	ICNS або каталог ресурсів Xcode, розміри до 1024 × 1024 px	—
Сторінка в Google Play	32-бітний PNG 512 × 512 px, до 1024 KB	—
Apple App Store	PNG 1024 × 1024 px без прозорості	—

SVG

Масштабована векторна графіка (SVG)

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 в іконку шукають, коли є один векторний логотип і кілька платформ, кожна зі своїм контейнером іконок: від favicon.ico на сайті до ICNS на Mac і PNG потрібних розмірів у магазинах застосунків.

Конвертуйте SVG у файли іконок для Windows, Mac, Android та iOS

Залиште ICO і Розміри іконок зі значенням «Усі розміри». Перейменуйте результат на favicon.ico для кореня сайту або вкажіть його в діалозі зміни іконки ярлика Windows.

Один .ico підходить для вкладок, закладок і панелі завдань
Додайте PNG 180 px для закладок на головному екрані iPhone

Як створити SVG, що добре виглядає у 16 px

Іконка 16 × 16 px має лише 256 пікселів. Більшість брендів мають окремий знак для іконок, часто лише символ або одну літеру, з виразними формами та малою кількістю кольорів; якщо у вас його ще немає, зробіть спрощену копію SVG для іконок.

Перед конвертуванням перевірте viewBox. Широкий viewBox дає іконку з порожніми смугами над знаком і під ним, тому спершу обріжте його до квадрата; про квадратне обрізання йдеться в посібнику як обрізати зображення за пропорціями, а SVG у PNG дає швидкий великий попередній перегляд, щоб оцінити дизайн.

SVG в іконку: часті запитання

Чим ця сторінка відрізняється від SVG в ICO?

SVG у ICO зосереджений на одному файлі .ico для фавіконок і Windows. Ця сторінка охоплює всі місця, де потрібна іконка, зокрема ICNS для macOS і PNG фіксованих розмірів, яких вимагають Android, iOS та магазини застосунків.

Який формат іконок використовує кожна операційна система?

Windows читає ICO, macOS — ICNS або каталоги ресурсів, створені в Xcode, а Android та iOS приймають PNG-зображення фіксованих розмірів у пікселях.

Чи можна отримати всі розміри PNG для програми за одну конвертацію?

Ні. PNG містить один розмір, тому кожне конвертування створює одну ширину. Вкажіть в полі Змінити розмір результату один розмір, конвертуйте, потім змініть число й конвертуйте знову; кожен розмір малюється чітко з вектора.

Чи підходить ICNS із цієї сторінки для іконок Mac з Retina?

Він містить розміри від 16 до 256 px. Сучасні іконки застосунків macOS також мають варіанти 512 px і 1024 px для екранів Retina, які Xcode або iconutil від Apple збирають із PNG; експортуйте ці два розміри тут як PNG і додайте до набору.

Чи варто залишати іконці прозорий фон?

Для ICO, ICNS і шарів лаунчера Android — так: прозорість дозволяє системі намалювати власне тло. Виняток — іконка iOS для App Store: Apple відхиляє маркетингову іконку 1024 px з альфа-каналом, тому для цього PNG задайте в SVG суцільний фон.

Чому детальний логотип у маленькій іконці перетворюється на пляму?

У 16 або 32 px немає місця для тонких ліній чи дрібного тексту. Потовщіть штрихи так, щоб на найменшому розмірі вони займали щонайменше один піксель, і приберіть текстовий логотип.