Оптимизатор SVG

Уменьшить размер файлов SVG

Файлы не покидают устройство
Работает в браузере
Бесплатно, без регистрации и водяных знаков

Drop SVG files here, or click to choose

Поддерживается SVG, SVGZ · Можно также вставить через Ctrl+V / ⌘V

Or paste SVG code

Tip: paste SVG code anywhere on this page with Ctrl+V / ⌘V.

Как пользоваться: Оптимизатор SVG

Уменьшайте файлы SVG с SVGO, не покидая браузер. Выберите пресет «По умолчанию», «Безопасный» или «Максимум» либо переключайте отдельные плагины, проверьте пиксельную разницу с оригиналом и экспортируйте результат как SVG, data URI или компонент React.

1
Перетащите файлы SVG или SVGZ на страницу либо вставьте код SVG; «Образец» загружает пример.
2
В «Оптимизации» выберите «По умолчанию», «Безопасный» или «Максимум» и настройте точность чисел, многопроходность и красивую печать.
3
По желанию откройте группы плагинов, чтобы включать и выключать отдельные плагины SVGO; «Сброс» возвращает к умолчанию.
4
Сравните результат рядом, ползунком или в «Отличиях», где изменённые пиксели показаны красным.
5
Выберите вкладку SVG, Data URI или React, затем нажмите «Скачать SVG» или «Скачать .jsx»; для нескольких файлов используйте «Скачать всё (ZIP)».

Частые вопросы

Загружаются ли мои SVG?

Нет. SVGO работает в фоновом воркере браузера, файлы не покидают устройство.

Изменит ли оптимизация вид моего SVG?

Пресет по умолчанию стремится к тому же виду. «Отличия» отрисовывают обе версии и сообщают долю изменённых пикселей или «Выглядит одинаково». Очень низкая точность чисел может исказить мелкие детали.

Какой пресет подходит анимированному или скриптовому SVG?

Безопасный. Он не трогает структуру, идентификаторы и фигуры, поэтому селекторы CSS и скрипты по-прежнему находят свои элементы.

Почему «Максимум» убрал ширину и высоту?

«Максимум» также отбрасывает заголовки, размеры и скрипты, что подходит значкам, которые используют через CSS или img; SVG тогда масштабируется под контейнер. Снимите removeDimensions в «Веб-встраивании», чтобы сохранить размер.

Использовать data URI в Base64 или в URL-кодировке?

В большинстве случаев оставьте Base64 выключенным: URI в URL-кодировке обычно короче и лучше сжимается gzip. Включайте его, только если инструмент ждёт Base64.

Как работает экспорт React?

Вкладка React оборачивает оптимизированный SVG в компонент JSX, названный по файлу, с атрибутами, переписанными для JSX, и props, переданными элементу svg. «Скачать .jsx» сохраняет его.