Безплатен конвертор

SVG към PNG Конвертор

Конвертирайте векторни SVG файлове във висококачествени растерни PNG изображения. Персонализирайте изходния мащаб и цвета на фона лесно във вашия браузър.

Плъзнете и пуснете SVG тук

Поддържа до 50 MB

или

За този инструмент

SVG (Scalable Vector Graphics) описва изображенията като набор от геометрични примитиви — пътеки, форми, текст, градиенти — които се мащабират до всякакъв размер без загуба на качество. PNG съхранява една правоъгълна пикселна мрежа с фиксирана резолюция. Преобразуването на SVG в PNG е стъпка на растеризация: инструкциите за рисуване на SVG се оценяват при избран размер на пиксела и полученото растерно изображение се кодира като PNG. Резултатът изглежда ясен при размера, който сте посочили, но се пикселизира, ако се увеличи.

Този конвертор изобразява SVG с помощта на вградената SVG машина на браузъра. SVG се зарежда в елемент на изображение, чертае се върху HTML5 платно с избраните изходни размери и се експортира като PNG чрез canvas.toBlob. Тъй като браузърът прави растеризацията, сложните SVG функции - градиенти, филтри, маски, анимации като статична рамка - се изобразяват по същия начин, както биха направили на истинска уеб страница.

Най-важното решение при конвертирането от SVG към PNG е целевият размер. SVG не зависи от разделителната способност, така че избирането на размер на PNG, който съответства на действителната употреба, избягва прекомерното обезпечаване (огромни файлове за икони с размер на миниатюра) и недостатъчното обезпечаване (размазан изход при по-късно мащабиране). Често срещани цели: 32 × 32 или 64 × 64 за икони, 256 × 256 или 512 × 512 за лога, 1024 × 1024 за героични графики, 2048 × 2048 за активи с качество на ретината.

Защо да конвертирате SVG в PNG

SVG е прекрасен за уеб и модерни инструменти за проектиране, но е ужасен за много други контексти. Клиентите за електронна поща изобразяват SVG непоследователно; някои го блокират като риск за сигурността. По-старият офис софтуер, някои CMS, услуги на трети страни и почти всички канали за печат на снимки изобщо не приемат SVG. Преобразуването в PNG създава универсално приет растер, който изглежда идентичен при избрания размер.

PNG също така се вгражда надеждно в офис документи, слайдове и PDF файлове, без да зависи от SVG рендъра на получателя. За лога и графики, които трябва да се показват последователно в много платформи, PNG е по-безопасният избор - въпреки че губи независимостта от разделителната способност, която прави SVG привлекателен на първо място.

Как да използвате

Изберете вашия целеви размер, изобразете. Браузърът прави растеризацията.

  1. Качете SVG файла: Плъзнете SVG в областта за качване или щракнете, за да прегледате. Поддържат се файлове до 50 MB, въпреки че типичните SVG са доста под 1 MB. Самостоятелните SVG работят най-добре; SVG, които препращат към външни изображения чрез xlink:href към отдалечени URL адреси, може да се изобразяват непълни.
  2. Изберете изходния размер: По подразбиране са естествените размери на viewBox на SVG, но можете да замените с произволен размер на пиксела. Изберете размер, който съответства на действителната ви употреба — избягвайте да създавате 4K PNG за икони, които ще се показват на 32×32.
  3. Рендиране: Браузърът анализира SVG, рисува го върху платно с исканите размери и експортира платното като PNG. Сложните SVG файлове с филтри или голям брой пътища може да отнемат известно време; прости икони се изобразяват незабавно.
  4. Изтеглете PNG: Запазете файла. Прозрачността в SVG (всичко извън нарисуваните форми) се запазва като алфа канал в PNG.

Обичайни случаи на употреба

Технически подробности

SVG (Препоръка на W3C) е векторен формат, базиран на XML, с елементи за пътеки, основни фигури (правоъгълник, кръг, елипса, линия, многоъгълник, полилиния), текст, градиенти (linearGradient, radialGradient), филтри, маски и изрязващи пътеки. Браузърът анализира XML, изгражда DOM, прилага CSS и растеризира резултата по време на рендиране на страницата.

Този конвертор зарежда SVG в HTMLImageElement (който задейства нормалния път на рендиране на SVG като изображение на браузъра), след което го рисува на платно чрез drawImage. Платното се експортира като PNG с помощта на canvas.toBlob('image/png'). Точните пиксели в изхода съвпадат с това, което SVG би изобразил със същия размер в раздел на браузър.

Крайни случаи: SVG, използващ ForeignObject, не винаги се поддържа, когато се използва чрез елемент Image. SVG, препращащ към външни ресурси (xlink:href към различен домейн), може да не успее да се зареди поради CORS. SMIL анимациите и управляваните от JavaScript анимации се изобразяват само като начален кадър.

Най-добри практики

Често задавани въпроси

Моят SVG ще загуби ли качество, когато се преобразува в PNG?
Преобразуването от вектор към растер означава, че изображението става базирано на пиксели и вече не може да се мащабира безкрайно. Изберете висока разделителна способност, за да сте сигурни, че PNG изглежда рязко при желания размер на дисплея.
За какво се използва формат PNG?
PNG (Portable Network Graphics) се използва предимно за графики с прозрачност, екранни снимки, лога, икони.
Има ли някакви ограничения, за които трябва да знаете?
Поддържат се файлове до 50 MB. Обработката на много големи или сложни файлове може да отнеме повече време. Цялото преобразуване се извършва във вашия браузър, така че скоростта на обработка зависи от вашето устройство.
Моите изображения запазват ли се поверителни по време на конвертирането?
да Вашите SVG файлове се обработват изцяло във вашия браузър с помощта на Canvas API и JavaScript. Нищо не се качва на сървър — файлът отива директно от вашето устройство към конвертора и обратно към вашето устройство.
Текстът изобразява ли се като текст или като пътеки?
Текстът се растерира като пиксели в изходния PNG. Резултатът вече не може да се търси или избира. Ако вашият SVG използва шрифтове, които не са налични в браузъра, текстът може да се визуализира в резервен шрифт; конвертирайте текст в пътеки в SVG преди изобразяване за гарантиран външен вид.
Моят SVG качен ли е на сървър?
Не. Анализът и изобразяването на SVG се извършват във вашия браузър; PNG кодирането се извършва във вашия браузър. Файлът не напуска вашето устройство.
Защо моят конвертиран PNG е празен?
Често срещани причини: SVG препраща към външни изображения, които не са успели да се заредят поради CORS; SVG използва функции, които не се поддържат от пътя за рендиране на Image-element (foreignObject, определени филтри); SVG има нулево измерение viewBox. Отворете SVG директно в браузър, за да потвърдите изобразяването му преди конвертиране.
Мога ли да конвертирам SVG в PNG в скрипт?
Да — за групови задания, настройка на Node.js, използваща sharp или puppeteer, изобразява SVG в PNG с подобна прецизност на браузъра. Този инструмент е за еднократни реализации в браузъра, без да инсталирате нищо.