SVG 벡터 파일이나 XML 소스 코드를 화질 저하 없는 투명 배경 PNG 이미지로 즉시 변환합니다. 서버 업로드 없이 브라우저 내에서 원하는 픽셀 해상도와 상업 인쇄용 300 DPI 메타데이터를 정확하게 생성하세요.
또는 클릭하여 찾아보기
벡터 패스, 그라데이션 및 알파 투명 채널이 고해상도 배율 확대 및 300 DPI 인쇄 설정에서 어떻게 출력되는지 확인해 보세요.
원본 256px 아트보드를 벡터 수학 좌표 상태에서 4배 확대한 후 캔버스에 래스터화했습니다. 곡선 가장자리 깨짐(계단 현상) 없이 매끄러우며, 8비트 알파 채널이 유지되어 다크 모드 UI 위에서도 자연스럽게 합성됩니다.
8×10인치(300 DPI 기준 2400×3000픽셀)로 정밀 렌더링하고 PNG 헤더에 표준 pHYs 물리적 픽셀 밀도 청크(미터당 11,811픽셀)를 기록했습니다. 인디자인(InDesign)이나 인쇄 템플릿에 실제 물리 치수 그대로 즉시 배치할 수 있습니다.
코드 에디터의 인라인 <svg> 태그를 "SVG 코드 붙여넣기" 탭에 바로 입력하고 순백색(#FFFFFF) 배경을 합성했습니다. 카카오톡, 슬랙, 노션의 다크 모드에서 투명 다이어그램의 검은 글씨가 배경에 묻혀 보이지 않는 문제를 해결합니다.
SVG는 웹 화면 확대에 완벽한 벡터 포맷이지만, 수많은 쇼핑몰 관리자 페이지, 문서 도구 및 인쇄소 시스템에서는 여전히 XML 벡터 파일 업로드를 거부합니다. 본 도구는 기밀 디자인 자산을 외부 서버에 노출하지 않고 다음 문제를 해결합니다:
네이버 스마트스토어, 쿠팡, 쇼피파이 상품 등록 페이지나 블로그, 이메일 뉴스레터 빌더는 보안(XSS 방지) 정책상 .svg 업로드를 차단합니다. 벡터 로고와 배지를 몇 초 만에 호환성 높은 무손실 PNG로 변환하세요.
일반 브라우저에서 "이미지를 다른 이름으로 저장"하면 72 DPI 화면 해상도로 저장되어 인쇄 시 흐릿해집니다. 사용자 지정 고해상도 픽셀 입력과 300 DPI 메타데이터 주입 기능으로 인쇄소 입고 기준을 완벽히 충족합니다.
React, Vue 컴포넌트나 웹페이지 소스 코드 안에 들어있는 <svg>...</svg> 마크업을 이미지 파일로 추출해야 할 때, 별도로 메모장을 열어 .svg 파일로 저장할 필요 없이 코드를 바로 붙여넣어 PNG로 내려받을 수 있습니다.
브라우저 내 HTML5 Canvas 엔진이 정확한 비율과 타이포그래피로 벡터를 렌더링할 수 있도록 다음 기술 사양을 확인해 주세요:
SVG 1.1 및 SVG 2.0 표준을 준수하는 .svg 파일 업로드 또는 <svg>로 시작하는 원시 XML 코드 붙여넣기를 지원합니다. 압축된 .svgz 파일은 먼저 .svg로 압축을 풀어주세요.
최상위 <svg> 태그에 viewBox="0 0 가로 세로" 또는 너비/높이 속성이 포함되어야 래스터라이저가 원본 종횡비를 정확히 계산할 수 있습니다.
SVG 내부에 외부 폰트(<text> 태그)가 사용된 경우, 일러스트레이터의 "윤곽선 만들기(Create Outlines)" 또는 피그마의 "Flatten"을 통해 패스로 변환해 두어야 기본 시스템 폰트로 대체되는 현상을 막을 수 있습니다.
브라우저 보안 샌드박스는 SVG 내부에서 외부 http:// URL을 호출하는 <image> 태그를 차단합니다. 비트맵이 포함된 경우 data:image/png;base64 형식으로 내장되어 있어야 합니다.
하나 이상의 .svg 파일을 업로드 영역에 드래그 앤 드롭하거나, "SVG 코드 붙여넣기" 탭으로 전환하여 <svg>...</svg> 코드를 직접 입력합니다 ("샘플 SVG 불러오기"로 즉시 테스트 가능).
해상도 배율(1x 원본, 2x 레티나, 4x 초고화질)을 선택하거나 원하는 가로/세로 픽셀값을 직접 입력(종횡비 고정 지원)하고, 용도에 따라 72 / 150 / 300 DPI 메타데이터를 선택합니다.
32비트 알파 투명 채널을 유지하려면 "투명(Transparent)"을 그대로 두고, 불투명 배경이 필요하면 흰색, 검은색 또는 컬러 피커로 원하는 배경색을 지정하세요.
"변환 시작" 버튼을 클릭하면 브라우저가 즉시 캔버스 렌더링을 수행합니다. 변환된 PNG를 개별 다운로드하거나 하나의 ZIP 압축 파일로 일괄 다운로드할 수 있습니다.
출력된 모든 파일은 무손실 DEFLATE 압축과 선택적 pHYs 해상도 청크가 적용된 표준 32비트 RGBA PNG 이미지입니다:
2배(@2x) 및 4배(@4x)로 렌더링된 투명 PNG 아이콘을 Xcode 에셋 카탈로그, 안드로이드 스튜디오 drawable 폴더, 피그마 컴포넌트에 깨짐 없이 바로 적용할 수 있습니다.
SVG 직접 삽입을 지원하지 않거나 그라데이션이 깨지는 문서 작성 프로그램에 고해상도 PNG로 로고와 아키텍처 다이어그램을 선명하게 배치할 수 있습니다.
300 DPI 메타데이터가 내장된 고화질 투명 PNG를 인쇄소, 스티커 제작 업체, 티셔츠 디지털 프린팅(DTG) 공정에 그대로 전달할 수 있습니다.
클라이언트 측 브라우저 렌더링은 엄격한 W3C 보안 정책과 GPU 메모리 한계를 따릅니다. 자주 발생하는 예외 상황과 해결책은 다음과 같습니다:
개인정보 및 보안을 위해 브라우저의 SVG-in-Image 샌드박스는 캔버스 변환 중 외부 @font-face 웹폰트 네트워크 로드를 차단합니다.
일러스트레이터(문자 → 윤곽선 만들기)나 피그마(우클릭 → Flatten)에서 텍스트 레이어를 모두 벡터 패스(곡선)로 변환한 뒤 SVG를 저장해 주세요.
원본 SVG 코드에 viewBox 속성이 누락되었거나 그래픽 패스 좌표가 선언된 아트보드 영역 밖에 그려져 있기 때문입니다.
먼저 당사의 "SVG 뷰어 및 코드 검사기 (/svg-viewer/)"에서 바운딩 박스를 확인하거나 루트 <svg> 태그에 올바른 viewBox="0 0 가로 세로" 속성을 추가하세요.
최신 데스크톱 및 모바일 브라우저는 HTML5 <canvas> 요소에 하드웨어 GPU 텍스처 메모리 제한(보통 한 변 최대 16,384px 또는 총 2억 6,800만 픽셀)을 적용합니다.
출력 픽셀 크기를 8192×8192 px 이하(일반 대형 포스터 300 DPI 인쇄도 3600×4800 px면 충분합니다)로 설정하여 변환해 주세요.
단일/정밀 SVG PNG 변환기와 대량 일괄 변환기 및 기존 클라우드 서버 업로드 도구의 차이점을 비교해 보세요:
| 비교 항목 / 시나리오 | SVG PNG 변환기 (현재 도구) | SVG 일괄 변환기 (/batch-converter/) | 일반 클라우드 서버 변환 사이트 |
|---|---|---|---|
| 핵심 워크플로우 목적 | 정확한 가로×세로 픽셀(px) 지정, SVG 코드 직접 붙여넣기 및 300 DPI 인쇄 메타데이터 출력 | 수십~수백 개의 SVG 아이콘을 한 번에 PNG, JPG, WebP로 일괄 변환 후 ZIP 다운로드 | 원격 서버에 파일을 업로드하여 대기열 처리 (일일 파일 개수 및 용량 제한 존재) |
| 픽셀 크기 및 DPI 제어 | 원하는 가로×세로(px) 직접 입력, 1x~4x 프리셋 및 72 / 150 / 300 DPI pHYs 청크 주입 | 전체 파일 일괄 배율 확대(1x, 2x, 4x) 및 파일명 접두사/접미사 규칙 일괄 적용 | 대부분 72 DPI 화면 해상도 고정 출력이며 물리적 인쇄 DPI나 정밀 픽셀 지정 불가 |
| SVG XML 코드 직접 입력 | "SVG 코드 붙여넣기" 탭 내장으로 인라인 <svg> 마크업 즉시 변환 지원 | 파일 및 폴더 드래그 앤 드롭 전용 (대량 파일셋 처리에 최적화) | 거의 지원하지 않음 (로컬에 .svg 파일로 먼저 저장한 후 업로드해야 함) |
| 데이터 보안 및 처리 속도 | 100% 브라우저 로컬 Canvas 처리 — 서버 전송 0바이트, 밀리초 단위의 즉각적인 변환 | 100% 로컬 브라우저 병렬 처리 및 클라이언트 측 JSZip 압축 | 미공개 로고 및 기밀 도면이 외부 서버에 업로드되어 유출 위험 및 네트워크 지연 발생 |
표준 인쇄 공식인 "인치(Inch) × 300 = 목표 픽셀"(밀리미터 기준: "mm ÷ 25.4 × 300 = 목표 픽셀")을 사용하면 됩니다. 예를 들어 가로 4인치 × 세로 6인치 크기의 스티커를 300 DPI로 인쇄하려면 사용자 지정 픽셀 크기에 가로 1200 px, 세로 1800 px를 입력하고 DPI 설정에서 "300 DPI (고해상도 상업 인쇄)"를 선택하세요. 정확한 픽셀 그리드 렌더링과 함께 PNG 파일 헤더에 300 DPI pHYs 메타데이터가 기록됩니다.
전혀 깨지지 않습니다. 일반 JPG나 PNG 비트맵을 강제로 늘리는 것과 달리, 본 변환기는 SVG의 수학적 벡터 좌표를 먼저 목표 해상도로 스케일링한 후 HTML5 Canvas에 새로 그리므로(래스터화) 어떤 크기로 출력하든 곡선과 대각선이 칼날처럼 선명하게 유지됩니다.
절대 전송되지 않습니다. 모든 SVG 파싱, 캔버스 렌더링 및 PNG 인코딩은 사용자의 웹 브라우저 내부(JavaScript 및 Web Canvas API)에서만 100% 로컬로 실행됩니다. 페이지를 연 뒤 인터넷 연결을 끊어도 오프라인으로 완벽하게 작동합니다.
윈도우 기본 사진 앱이나 모바일 갤러리 등 일부 뷰어는 투명 영역을 쉽게 알아볼 수 있도록 임의로 흰색이나 검은색 배경을 깔아서 보여줍니다. 본 도구에서 "투명"을 선택하고 다운로드 버튼으로 저장한 파일은 완벽한 32비트 RGBA 투명 PNG이므로 포토샵, 피그마, 웹페이지에 올리면 정상적으로 투명하게 표시됩니다.
고해상도 32비트 PNG는 무손실 포맷 특성상 용량이 큽니다. 다운로드한 후 하단 관련 도구의 "PNG 압축기 (/png-compressor/)"를 사용하면 픽셀 해상도와 알파 투명도를 100% 그대로 유지하면서 스마트 색상 양자화를 통해 파일 크기를 50%~75%까지 줄일 수 있습니다.
각 작업에 최적화된 브라우저 기반 이미지 및 벡터 도구를 바로 이용해 보세요.
수십~수백 개의 SVG 파일을 한 번에 PNG, JPG, WebP로 일괄 변환하여 ZIP 파일로 다운로드합니다.
불필요한 메타데이터와 주석을 제거하여 화질 저하 없이 SVG 파일 크기를 40%~80% 줄입니다.
원본 이미지 해상도(가로×세로 픽셀)를 그대로 유지하면서 스마트 색상 양자화로 PNG 용량을 최대 75% 줄입니다.
투명/어두운 배경에서 SVG를 미리 보고, viewBox 및 크기 속성을 확인하며 XML 코드를 포맷팅합니다.