Как конвертировать SVG в PNG без потери качества

SVG состоит не из пикселей. Это набор инструкций: нарисуй здесь линию, залей эту фигуру таким-то цветом, поэтому его можно нарисовать любого размера и он останется идеально чётким. Именно поэтому логотипы и иконки так часто делают в SVG: один и тот же файл выглядит чётким и на визитке, и на рекламном щите.

PNG, наоборот, представляет собой фиксированную сетку пикселей. Если экспортировать его, скажем, шириной 512 пикселей, вы получите именно это. Увеличьте его сверх исходного размера, и он станет блочным, точно так же, как при увеличении фотографии. Преобразование SVG в PNG означает превращение этих инструкций рисования в фиксированную сетку, этот шаг называется растеризацией.

Поскольку PNG имеет фиксированный размер пикселей, единого «беспотерьного» способа конвертации SVG в PNG не существует: вы выбираете разрешение, и от этого выбора зависит качество. Хитрость в том, чтобы рендерить с разрешением, достаточно высоким для того, как изображение будет использоваться на самом деле.

Хорошее эмпирическое правило: экспортировать в два-три раза больше того размера, в котором изображение будет показано. Если логотип показывается на странице шириной 200 пикселей, экспортируйте его в 400 или 600 пикселей, чтобы он оставался чётким на экранах с высоким разрешением. Нужно для печати? Выберите размер ещё больше. Единственная настоящая ошибка: экспортировать слишком маленький размер, а потом увеличивать его, именно это заметно ухудшает качество.

Конвертация выполняется прямо на вашем устройстве, поэтому файл никогда никуда не загружается:

• Откройте конвертер SVG → PNG и перетащите туда свой SVG.
• Задайте размер на выходе: введите нужную ширину в пикселях (чем больше значение, тем чётче результат и тем больше файл).
• Экспортируйте и скачайте свой PNG.

Поскольку всё происходит прямо в браузере, вы можете отключиться от интернета после загрузки страницы, и всё продолжит работать, это доказывает, что SVG никуда не отправляется на сервер. Не нужен аккаунт, нет водяных знаков и нет ограничений на количество конвертаций.

SVG часто имеет прозрачный фон, и это сохраняется напрямую: экспортируйте в PNG, и прозрачные области останутся прозрачными, потому что PNG поддерживает альфа-канал. За вашим логотипом внезапно не появится белый прямоугольник.

Если вы не уверены, какую ширину в пикселях выбрать, отталкивайтесь от того, где будет показано изображение. Иконке сайта может хватить всего 64 пикселей; главному изображению может понадобиться 2 000 пикселей и больше. Если сомневаетесь, выбирайте размер побольше: позже вы всегда сможете сжать PNG, чтобы уменьшить файл, но вы не сможете добавить детали обратно в изображение, экспортированное слишком маленьким. А если позже вам понадобится JPG, конвертация PNG в JPG займёт всего секунду.