SVG에서 PNG로 변환기
벡터 SVG 파일을 고품질 래스터 PNG 이미지로 변환합니다. 브라우저에서 출력 크기와 배경색을 쉽게 사용자 정의하세요.
여기에 SVG를 드래그 앤 드롭하세요.
최대 50MB까지 지원
벡터 SVG 파일을 고품질 래스터 PNG 이미지로 변환합니다. 브라우저에서 출력 크기와 배경색을 쉽게 사용자 정의하세요.
최대 50MB까지 지원
SVG(Scalable Vector Graphics)는 이미지를 품질 저하 없이 어떤 크기로든 확장되는 기하학적 기본 요소(경로, 모양, 텍스트, 그라데이션)의 집합으로 설명합니다. PNG는 단일 직사각형 픽셀 격자를 고정된 해상도로 저장합니다. SVG를 PNG로 변환하는 것은 래스터화 단계입니다. SVG의 그리기 명령은 선택한 픽셀 크기에서 평가되고 결과 비트맵은 PNG로 인코딩됩니다. 지정한 크기에서는 출력이 선명해 보이지만 크기를 확대하면 픽셀화됩니다.
이 변환기는 브라우저에 내장된 SVG 엔진을 사용하여 SVG를 렌더링합니다. SVG는 이미지 요소에 로드되고, 선택한 출력 크기로 HTML5 캔버스에 그려지며, canvas.toBlob을 통해 PNG로 내보내집니다. 브라우저가 래스터화를 수행하기 때문에 복잡한 SVG 기능(그라디언트, 필터, 마스크, 정적 프레임으로서의 애니메이션)이 실제 웹페이지에서와 동일한 방식으로 렌더링됩니다.
SVG를 PNG로 변환할 때 가장 중요한 결정은 대상 크기입니다. SVG는 해상도에 독립적이므로 실제 사용량과 일치하는 PNG 크기를 선택하면 과도한 프로비저닝(썸네일 크기 아이콘의 대용량 파일) 및 과소 프로비저닝(나중에 확대할 때 출력이 흐릿함)을 방지할 수 있습니다. 일반적인 대상: 아이콘의 경우 32×32 또는 64×64, 로고의 경우 256×256 또는 512×512, 히어로 그래픽의 경우 1024×1024, 레티나 품질 자산의 경우 2048×2048입니다.
SVG는 웹과 최신 디자인 도구에는 훌륭하지만 다른 많은 상황에는 좋지 않습니다. 이메일 클라이언트는 SVG를 일관되지 않게 렌더링합니다. 일부는 보안 위험으로 이를 차단합니다. 이전 사무용 소프트웨어, 특정 CMS, 타사 서비스 및 거의 모든 사진 인쇄 파이프라인은 SVG를 전혀 허용하지 않습니다. PNG로 변환하면 선택한 크기에서 동일하게 보이는 보편적으로 허용되는 래스터가 생성됩니다.
또한 PNG는 수신자의 SVG 렌더러에 의존하지 않고 사무실 문서, 슬라이드 데크 및 PDF에 안정적으로 포함됩니다. 여러 플랫폼에서 일관되게 표시되어야 하는 로고와 그래픽의 경우 PNG가 더 안전한 선택입니다. 비록 SVG가 애초에 SVG를 매력적으로 만드는 해상도 독립성을 잃더라도 말입니다.
대상 크기를 선택하고 렌더링하십시오. 브라우저가 래스터화를 수행합니다.
SVG(W3C 권장 사항)는 경로, 기본 모양(직사각형, 원, 타원, 선, 다각형, 폴리라인), 텍스트, 그라디언트(linearGradient, RadialGradient), 필터, 마스크 및 클립 경로에 대한 요소가 포함된 XML 기반 벡터 형식입니다. 브라우저는 XML을 구문 분석하고, DOM을 구축하고, CSS를 적용하고, 페이지 렌더링 중에 결과를 래스터화합니다.
이 변환기는 SVG를 HTMLImageElement(브라우저의 일반적인 SVG 이미지 렌더링 경로를 트리거함)로 로드한 다음 drawImage를 통해 캔버스에 그립니다. canvas.toBlob('image/png')를 사용하여 캔버스를 PNG로 내보냅니다. 출력의 정확한 픽셀은 SVG가 브라우저 탭에서 동일한 크기로 렌더링하는 것과 일치합니다.
극단적인 경우: foreignObject를 사용하는 SVG는 Image 요소를 통해 사용될 때 항상 지원되지는 않습니다. 외부 리소스(다른 도메인에 대한 xlink:href)를 참조하는 SVG는 CORS로 인해 로드되지 않을 수 있습니다. SMIL 애니메이션과 JavaScript 기반 애니메이션은 초기 프레임으로만 렌더링됩니다.