SVG → PNG
SVG 파일을 고해상도 PNG로 변환, 배경색·배율 설정 가능
SVG to PNG 변환기
SVG는 벡터 좌표로 그림을 기술하는 형식이라 원본 파일 자체에는 '해상도'라는 개념이 없지만, PNG는 정해진 가로세로 픽셀 수를 가진 래스터(비트맵) 이미지입니다. 이 도구는 SVG를 Blob URL로 변환해 Image 객체로 불러온 뒤 지정한 배율만큼 확대한 Canvas에 그려 픽셀로 '굽는(rasterize)' 방식으로 동작합니다. 예를 들어 원본이 100×100 크기인 SVG를 배율 4×로 변환하면 400×400px PNG가 만들어지는데, 벡터 좌표를 그대로 확대해서 그리기 때문에 계단 현상 없이 매끈하게 렌더링됩니다. 아이콘·로고 SVG를 앱 스토어 등록용 PNG로 변환하거나, SVG를 지원하지 않는 구형 이미지 편집 프로그램·PPT에 넣을 때 활용됩니다.
자주 묻는 질문
SVG를 PNG로 왜 변환하나요?
SVG는 브라우저와 최신 디자인 툴에서는 잘 열리지만, 구형 이미지 뷰어, 일부 워드프로세서, 인쇄소 워크플로우, PPT 삽입 등에서는 지원되지 않거나 깨지는 경우가 있어 어디서나 열리는 PNG로 미리 변환해두는 것이 안전합니다.
배율 설정은 어떻게 하나요?
배율은 SVG의 원본 크기(viewBox 기준 픽셀 값)에 곱해지는 값입니다. 2×를 설정하면 가로세로가 각각 2배로 커진 PNG가 만들어지며, 레티나·고DPI 디스플레이용 아이콘이나 인쇄용 이미지처럼 큰 해상도가 필요하면 4× 이상을 권장합니다.
투명 배경이 작동하려면?
이 도구는 '투명 배경'을 켜면 Canvas에 배경색을 채우는 단계를 건너뛰고 SVG만 그립니다. 다만 SVG 코드 자체에 배경 도형이 포함되어 있으면 그 배경까지 함께 그려지므로, 원본 SVG가 배경을 직접 정의하지 않은 경우에만 완전한 투명 PNG가 나옵니다.
파일 크기가 서버로 전송되나요?
아니요. SVG 텍스트를 읽어 Blob URL을 만들고 Canvas에 그리는 모든 과정이 브라우저 안에서만 실행되므로 파일이 외부로 전송되지 않습니다.
외부 리소스가 있는 SVG는요?
SVG 안에 외부 URL을 참조하는 이미지 요소가 있으면, 브라우저의 CORS 정책 때문에 Canvas가 '오염(tainted)'된 것으로 간주되어 PNG 추출 시 보안 오류가 발생하고 변환이 실패할 수 있습니다.
어떤 SVG 파일을 지원하나요?
.svg 확장자를 가진 XML 기반 벡터 파일을 지원하며, 브라우저의 Image 객체가 SVG를 디코딩할 수 있는 표준 문법 범위 내에서 정상 작동합니다.
최대 배율은?
입력란에서 최대 8×까지 설정할 수 있습니다. 다만 배율이 커질수록 Canvas의 실제 픽셀 수가 기하급수적으로 늘어나므로, 원본이 큰 SVG를 8×로 변환하면 브라우저 메모리 한도에 부딪혀 처리에 실패할 수 있습니다.
애니메이션 SVG는 어떻게 되나요?
브라우저의 Image 객체는 SMIL이나 CSS 애니메이션이 포함된 SVG를 로드할 때 애니메이션이 시작되기 전, 첫 렌더링 시점의 정지 상태만 Canvas에 그리기 때문에 결과 PNG는 항상 정지 프레임 하나로 캡처됩니다.