Конвертировать SVG в PNG Scalable Vector Graphics ↔ Portable Network Graphics Бесплатно Онлайн Безопасно

Зачем люди конвертируют SVG в PNG

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

PNG — естественный выбор для этой задачи. Он сохраняет каждый пиксель точно так, как он был нарисован, и сохраняет прозрачность, поэтому логотип без фона остаётся логотипом без фона. Его понимает каждый браузер, редактор, офисная программа и телефон. Для SVG, состоящего в основном из плоского цвета и резких краёв, PNG — формат, воспроизводящий его верно.

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

Как работает конвертация

Инструкции выполняются один раз

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

Песочница, где ничто не может выполняться

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

Размер выбираете вы

Поскольку у SVG нет собственных пикселей, вы решаете, сколько их будет у PNG. Выберите ширину, а высота следует из пропорций изображения. Больший размер даёт более чёткую картинку и более тяжёлый файл.

Что сохраняется

Каждая фигура как нарисована

Каждая фигура сохраняется как нарисована: кривые, заливки, штрихи и порядок слоёв. PNG — верная картинка того, как SVG выглядит в браузере.

Собственные пропорции изображения

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

Прозрачность

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

Что следует знать, прежде чем конвертировать SVG в PNG

PNG — это один размер навсегда

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

Шрифты и картинки из других мест не загружаются

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

Размер файла зависит от картинки

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

Как конвертировать SVG в PNG здесь

Добавьте свой рисунок

Перетащите SVG на страницу или выберите его на своём устройстве. Он читается внутри вашего браузера и не загружается.

Выберите размер

Выберите ширину PNG. Подумайте о самом большом месте, где картинка будет использоваться, и выберите этот размер.

Конвертируйте и скачайте

Нажмите кнопку и скачайте PNG. Откройте его, посмотрите на края и текст и проверьте, что прозрачные области по-прежнему прозрачны.

Ближе к SVG и PNG

Вектор и растр

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

Почему PNG, а не JPG

Для рисунка PNG почти всегда лучший ответ. Он сохраняет резкие края чистыми и сохраняет прозрачность. JPG смягчает плоские цвета и края и не имеет прозрачности. Если что-то принимает только JPG, используйте SVG в JPG; в остальных случаях оставайтесь с PNG.

Разрешение и экраны

Современные экраны часто показывают картинки с вдвое или втрое большей плотностью, чем старые. Если ваш PNG будет появляться на таких экранах в заданном размере на странице, сделайте его вдвое шире этого размера, и он будет выглядеть чётко.

Типичные ситуации подробно

Логотипы для почты и социальных сетей

Многие почтовые программы и социальные платформы не принимают SVG. Конвертируйте SVG в PNG в размере, который они просят, и ваш логотип пройдёт с прозрачным фоном.

Картинки для документов и презентаций

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

Значки для приложений и сайтов

Набору значков, нарисованному как SVG, часто нужны версии PNG для мест, не читающих векторы. Делайте их в нужных размерах и сохраняйте SVG как мастер.

Графики и диаграммы

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

Практические советы перед конвертацией SVG в PNG

Проверьте, как SVG выглядит в браузере

Сначала откройте SVG в браузере. То, что вы видите там, — то, что покажет PNG. Если в тексте используется шрифт, которого нет в вашей системе, ожидайте той же замены в PNG.

Преобразуйте текст в контуры для точности

Если важны точные буквы, преобразуйте текст в программе рисования в контуры, прежде чем сохранять SVG. Тогда буквы становятся фигурами, и для их рисования не нужен шрифт.

Встройте картинки

Если ваш SVG включает картинки, встройте их в файл, а не ссылайтесь на них. Подключённую картинку песочница найти не может.

Выбирайте размер с мыслью о будущем

Подумайте, где ещё может использоваться картинка. Размер, достаточно большой для плаката, подходит и для веб-страницы. Размер, сделанный для крошечного значка, бесполезен везде в других местах.

Вопросы, которые задают перед конвертацией

Какой размер выбрать?

Самый большой из нужных. PNG всегда можно уменьшить, но нельзя увеличить без размытия.

Сохранится ли прозрачность?

Да. Прозрачный фон в SVG прозрачен и в PNG.

Почему мой текст выглядит иначе?

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

Почему отсутствует подключённая картинка?

Картинки, подтягиваемые из-за пределов файла, не загружаются. Встройте их в SVG.

Загружается ли мой файл?

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

Можно ли вернуться к вектору?

Только обводкой. PNG в SVG превращает картинку в фигуры, но это догадка, а не восстановление. Сохраняйте ваш исходный SVG.

Мудрый выбор при конвертации SVG в PNG

Определитесь с местом назначения

Веб-странице нужен умеренный размер. Печати нужен большой. Значку нужен малый, простой. Подберите PNG под место.

Сравните с другими вариантами

Для фавикона SVG в ICO делает файл с несколькими размерами в одном. Для документа, остающегося чётким при любом увеличении, SVG в PDF сохраняет рисунок как рисунок.

Сохраните SVG

SVG — это мастер. Из него можно получить любой размер и любой формат в любой момент. Сохраните его в надёжном месте.

Как получить хороший результат после конвертации

Проверьте края

Увеличьте кривые и диагональные линии. Они должны быть гладкими. Если они выглядят зубчатыми, размер был слишком мал для использования, и поможет больший.

Проверьте на цветном фоне

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

Облегчите при необходимости

Если файл тяжёл, сжать PNG уменьшает его вес, заметно не меняя внешний вид.

Как извлечь максимум при конвертации SVG в PNG

Подготовьте SVG до конвертации SVG в PNG

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

Сделайте несколько размеров за один присест

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

Подумайте о фоне

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

Давайте осмысленные имена

Используйте имя, которое говорит, что это за картинка и насколько она велика, например logo-1600. Когда вы найдёте файл через год в папке, полной картинок, вы сразу будете знать, какой он.

Конфиденциальность и обращение

Почему локальная конвертация важна для рисунков

Логотипы, планы и проекты могут быть конфиденциальными до публикации. Многие онлайн-конвертеры загружают ваш файл на сервер, обрабатывают и присылают результат, и какое-то время копия живёт на машине, которую вы не контролируете. Здесь работу делает ваш собственный браузер, поэтому рисунок остаётся на вашем устройстве.

Что происходит, когда вы уходите

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

Если что-то пошло не так

Картинка получилась пустой

В SVG может отсутствовать размер или область просмотра. Откройте его в текстовом редакторе и проверьте, что у него есть ширина и высота или область просмотра, либо исправьте его в программе рисования.

Картинка обрезана

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

Страница зависает при очень большом размере

Всё работает на вашем устройстве, а огромной картинке нужна память. Выберите меньший размер или используйте компьютер.

Связанные инструменты

То же семейство инструментов охватывает соседние задачи. Для JPG используйте SVG в JPG. Для фавикона или значка приложения ответ — SVG в ICO, а для документа, остающегося чётким при любом увеличении, — SVG в PDF. Чтобы обвести картинку в фигуры, PNG в SVG идёт в другую сторону. Когда у вас есть PNG, PNG в WebP делает его легче для веба, а PNG в JPG делает небольшой файл, когда прозрачность не нужна.

Разобранный пример

Допустим, у вас есть логотип компании в виде SVG, а социальная сеть примет только PNG шириной не менее 800 пикселей. Вы перетаскиваете SVG сюда, выбираете ширину 1600 пикселей, для надёжности, и нажимаете кнопку. Через мгновение вы скачиваете PNG с теми же пропорциями, чёткими краями и прозрачным фоном. Вы загружаете его, и логотип чисто отображается на любом цвете. SVG остаётся в вашей папке как мастер.

Короткий контрольный список

Перед конвертацией

Откройте SVG в браузере. Определите самый большой нужный размер. Убедитесь, что шрифты в контурах, а картинки встроены.

Во время конвертации

Оставайтесь на странице, пока файл не будет готов.

После конвертации

Откройте PNG, проверьте края и текст, проверьте на настоящем фоне и сохраните SVG.

Частые ошибки

Выбор слишком малого размера

PNG — это один размер навсегда. Позднее увеличение размывает его. Выбирайте щедро.

Опора на подключённые шрифты и картинки

Они не загружаются в песочнице. Преобразуйте текст в контуры и встройте картинки.

Выбрасывание SVG

Сохраните его. Это единственная версия, которую можно масштабировать без ограничений.

Ваш рисунок остаётся на вашем устройстве

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

Итог

Чтобы конвертировать SVG в PNG здесь, перетащите рисунок, выберите размер и нажмите кнопку. SVG — это не картинка, а инструкции для её рисования, и здесь эти инструкции выполняются один раз в выбранном вами размере, а результат сохраняется как PNG. Рисунок отображается в песочнице, где ничто в файле не может выполняться, и ничего не загружается. Каждая фигура сохраняется как нарисована, с собственными пропорциями изображения и с прозрачностью. PNG — это один размер навсегда, поэтому выберите самый большой из нужных, ведь увеличение позже размывает его. Шрифты и картинки, которые SVG подтягивает из других мест, не загружаются, поэтому текст, набранный веб-шрифтом, заменяется системным.