Формат SVG
SVG — это XML-текст, который описывает не цвет каждой точки, а сами фигуры: прямые, кривые Безье, окружности, надписи. Отсюда главное свойство — увеличивайте сколько угодно, край останется идеально ровным, потому что при каждой отрисовке фигуры считаются заново. Отсюда же неочевидное следствие: файл картинки может содержать теги <script> и ссылки на внешние ресурсы, то есть быть исполняемым, а не только изобразительным.
Коротко о цифрах
- Природа формата
- текстовый XML с описанием фигур, а не сетка пикселей
- Масштабирование
- без потерь: фигуры пересчитываются при каждой отрисовке
- Прозрачность
- полная, включая частичную непрозрачность любого элемента
- Исполняемость
- допускает теги <script>; через <img> браузер их не выполняет
- У нас
- не принимается: инструменты работают с растровыми форматами
Почему вектор не то же самое, что «картинка получше»
Растровый файл хранит готовую сетку пикселей: увеличив её вдвое, вы получите те же данные, растянутые на большую площадь, и края расползутся. SVG хранит рецепт — «дуга отсюда досюда, толщина линии два, заливка такая». Устройство вывода исполняет рецепт в своём разрешении, поэтому логотип одинаково резок и в шапке сайта, и на баннере в человеческий рост.
Работает это ровно до тех пор, пока в файле действительно фигуры. Векторный контейнер может содержать вложенную растровую картинку в теге <image> — снаружи это по-прежнему .svg, но при увеличении вы увидите те же самые расплывшиеся пиксели. Проверяется просто: откройте файл текстовым редактором и посмотрите, что внутри — координаты путей или строка base64 на несколько экранов.
Безопасность: картинка, которая может исполняться
- SVG — это XML, и спецификация разрешает внутри него скрипты, ссылки, встроенные стили и вложенные документы.
- Браузер это учитывает: SVG, вставленный через тег <img>, рисуется в изолированном режиме — скрипты не выполняются, внешние ресурсы не подгружаются.
- А вот SVG, вставленный в разметку страницы напрямую или открытый по прямой ссылке, — полноценный документ со всеми правами обычной страницы.
- Практический вывод: SVG из непроверенного источника перед публикацией стоит прогнать через чистильщик разметки, а не просто переименовать.
Как получить PDF, не потеряв вектор
PDF сам по себе векторный: внутри него те же кривые, заливки и шрифты. Значит, при правильном переносе SVG остаётся вектором и в документе — текст выделяется, линии не пикселят при печати. Растеризация, то есть превращение SVG в картинку, уничтожает ровно то, ради чего формат и выбирали.
Наши инструменты SVG не принимают: дропзоны настроены на форматы, которые браузер отдаёт готовой пиксельной сеткой. Поэтому честный путь такой. Если файл сделан в редакторе — Inkscape, Illustrator, Figma, — экспортируйте PDF прямо оттуда, кривые сохранятся. Если исходника нет, откройте SVG в браузере и распечатайте страницу в PDF: системный принтер тоже работает с векторами. Растровый экспорт в PNG оставьте на случай, когда вектор действительно не нужен — например, для иконки в презентации.
Частые вопросы
Почему SVG не загружается в конвертер изображений?
Наши дропзоны принимают растровые форматы, которые браузер отдаёт готовой пиксельной сеткой. Векторный файл требует другой обработки, и притворяться, что мы её умеем, было бы нечестно.
Как сделать PDF из SVG и сохранить векторность?
Экспортируйте PDF прямо из редактора, где файл создавался, — кривые перенесутся как кривые. Второй способ: откройте SVG в браузере и напечатайте страницу в PDF через системный диалог печати.
SVG действительно может быть опасным?
Файл может содержать скрипты, поэтому загруженный с чужого сайта SVG не стоит выкладывать у себя без очистки. В теге картинки браузер их не исполняет, но по прямой ссылке файл открывается как обычная страница.
Почему мой SVG всё равно размывается при увеличении?
Скорее всего, внутри лежит вложенная растровая картинка, а не фигуры. Откройте файл текстовым редактором: если видите длинную строку base64 вместо координат путей, вектора там нет.