Інструмент завантажує офіційний браузерний рушій SVGO лише після натискання кнопки оптимізації. Він використовує стандартний набір плагінів і видаляє скрипти та обробники подій, щоб файл був безпечнішим для звичайного використання в інтернеті. ID можна зберегти, якщо від них залежать CSS, JavaScript, градієнти, маски або зовнішні посилання.
Стиснути SVG безкоштовно
Працює повністю у вашому браузері - без завантаження на сервер і без реєстрації.
Скрипти та обробники подій видаляються
Вхідний SVG
Оптимізований SVG
Ctrl або Command + Enter
Вставте SVG-розмітку або виберіть файл, щоб почати
Як стиснути SVG?
Оптимізація SVG зменшує векторний файл, видаляючи метадані редактора, коментарі, зайві атрибути та непотрібну точність чисел. Вставте розмітку або виберіть файл, щоб запустити SVGO безпосередньо у браузері. Порівняйте оригінал з результатом, а потім скопіюйте або завантажте менший SVG без надсилання своєї роботи на сервер.
Як користуватися
- 1Додайте SVG. Вставте повну SVG-розмітку, перетягніть локальний файл .svg у поле завантаження або відкрийте готовий приклад.
- 2Виберіть безпечні налаштування. Задайте точність чисел, залиште кілька проходів для додаткового зменшення та збережіть ID, на які посилається інший код.
- 3Оптимізуйте та порівняйте. Запустіть SVGO, а потім перевірте кількість байтів до й після обробки та обидва попередні перегляди.
- 4Скопіюйте або завантажте. Скопіюйте компактну розмітку або завантажте новий файл .optimized.svg, не змінюючи оригінальну роботу.
Кому це знадобиться
- Frontend-розробники зменшують значки, логотипи та ілюстрації перед додаванням на сайт або до бібліотеки компонентів.
- Дизайнери прибирають метадані й розмітку редактора з файлів, експортованих із Figma, Illustrator, Sketch або Inkscape.
- Команди з оптимізації швидкодії вимірюють точну економію байтів UTF-8 перед додаванням векторних ресурсів до вебпакета.
- Автори компонентів готують компактну вбудовану SVG-розмітку для React, Vue, Svelte або звичайного HTML.
Часті запитання
Стиснення SVG безкоштовне?
Так. SVG можна оптимізувати без облікового запису, оплати та встановлення програм. Інструмент показує точну зміну кількості байтів UTF-8, а результат можна відразу скопіювати або завантажити з браузера.
Мій файл SVG надсилається на сервер?
Ні. Читання файлу, робота SVGO, підрахунок байтів і створення попередніх переглядів відбуваються локально у браузері. Логотипи, значки та неопубліковані роботи не надсилаються цим інструментом.
Наскільки великий SVG можна стиснути?
Інструмент приймає SVG-код розміром до 5 МБ. Це обмеження допомагає зберігати швидкий розбір на телефонах і звичайних ноутбуках. У дуже великих ілюстраціях варто прибрати вбудовані растрові зображення або розділити роботу на менші ресурси.
Чи зміниться вигляд зображення після оптимізації SVG?
SVGO розроблено так, щоб прибирати зайві дані без зміни відтворення. Проте сильне округлення чисел або очищення ID може вплинути на складні файли. Порівняйте обидва перегляди та перевірте оптимізований SVG у реальному місці вбудовування перед заміною робочого ресурсу.
На що впливає точність десяткових знаків?
Цей параметр визначає, скільки цифр після коми SVGO залишає в координатах, перетвореннях і пов’язаних значеннях. Менше значення часто дає менший файл, але може помітно змістити деталі у дуже точних або великих роботах. Три цифри є практичним початковим значенням для більшості вебзначків та ілюстрацій.
Чи потрібно зберігати ID у SVG?
Зберігайте ID, якщо на них посилаються CSS, JavaScript, атрибути aria, градієнти, маски, фільтри або зовнішні документи. Для самостійної декоративної графіки цю опцію можна вимкнути, щоб SVGO видалив або скоротив невикористані ідентифікатори.
Чи видаляє оптимізатор скрипти з SVG?
Так. Під час оптимізації видаляються елементи script, атрибути обробників подій і посилання JavaScript. Це робить файл безпечнішим як звичайне вебзображення, але інструмент не підходить для SVG-застосунків, робота яких залежить від скриптів.
Що дає оптимізація у кілька проходів?
SVGO повторно обробляє результат, доки кожен прохід зменшує файл. Деякі перетворення відкривають нові місця для очищення на наступному проході, тому можна заощадити ще трохи. Основне зменшення зазвичай відбувається під час першого проходу.