SVG는 벡터 형식입니다 — 수학적 명령으로 도형과 경로를 저장합니다. PNG는 래스터 형식입니다 — 픽셀을 저장합니다. SVG를 PNG로 변환한다는 것은 특정 픽셀 크기로 벡터를 렌더링한다는 의미입니다. 플랫폼이 SVG를 지원하지 않거나, 인쇄 또는 소셜 미디어를 위한 고정 해상도 이미지가 필요하거나, 구형 소프트웨어와의 호환성이 필요할 때 PNG가 필요합니다. 4가지 무료 방법을 소개합니다.
변환 전: 올바른 해상도 선택
SVG는 해상도 독립적입니다 — 품질 손실 없이 어떤 크기로든 렌더링할 수 있습니다. 변환 전에 필요한 픽셀 크기를 결정하세요:
- 웹 아이콘: 32×32, 64×64, 또는 128×128 px — 파비콘과 UI 아이콘용 소형 PNG
- 소셜 미디어 프로필 이미지: 최소 400×400 또는 800×800 px
- 인쇄: 기본 300 DPI 사용 — 3인치 인쇄물에는 정사각형 로고를 위해 900×900 px 필요
- 레티나 / HiDPI 디스플레이: CSS 픽셀 크기의 2× 또는 3×으로 내보내기 (예: 100×100 CSS 요소에는 200×200 px PNG)
PNG는 내보낸 크기만큼만 선명합니다 — 따라서 필요한 가장 큰 크기를 선택하고 거기서부터 축소하세요.
방법 1: 브라우저 (가장 빠름, 설치 불필요)
모든 최신 브라우저는 SVG를 렌더링하고 PNG로 저장할 수 있습니다. 간단한 SVG를 위한 가장 빠른 방법입니다:
- Chrome, Firefox, 또는 Safari에서 SVG 파일 열기 (브라우저에 드래그)
- 이미지를 우클릭하고 이미지를 다른 이름으로 저장 선택 — 일부 브라우저는 직접 PNG 내보내기 제공
- 정확한 크기를 위해: 브라우저 DevTools(F12) 열기,
<svg>요소 찾기, 스크린샷 전에width와height속성을 목표 픽셀로 설정
제한사항: 브라우저 스크린샷은 화면 해상도로 제한됩니다. 고해상도 PNG(예: 4000×4000 px)는 Inkscape 또는 ImageMagick을 사용하세요.
방법 2: Inkscape (무료, 최고 품질)
Inkscape는 출력 해상도를 완전히 제어하는 SVG→PNG 변환을 위한 최고의 무료 도구입니다. Windows, Mac, Linux용 무료 오픈 소스입니다.
- inkscape.org에서 Inkscape 다운로드 및 설치
- Inkscape에서 SVG 파일 열기
- 파일 → PNG 이미지 내보내기로 이동 (또는 Windows/Linux에서Shift+Ctrl+E, Mac에서 Shift+Cmd+E)
- PNG 내보내기 대화 상자에서:
- 문서 탭: 문서 크기로 전체 SVG 캔버스 내보내기
- 드로잉 탭: 실제 드로잉 콘텐츠로 잘라내기 (빈 여백 제거)
- 선택 탭: 선택한 요소만 내보내기
- 픽셀 단위로 너비와 높이 설정, 또는 DPI 설정 (96 DPI = 화면, 300 DPI = 인쇄 품질)
- 다른 이름으로 내보내기 클릭, 파일명과 위치 선택, 내보내기 클릭
Inkscape는 기본적으로 투명도를 유지합니다 — SVG에 투명한 배경이 있으면 PNG도 투명한 배경을 가집니다.
방법 3: ImageMagick 명령줄 (일괄 변환)
여러 SVG를 변환하거나 프로세스를 자동화해야 할 때 ImageMagick(무료, 오픈 소스)이 터미널에서 작동합니다:
- imagemagick.org에서 ImageMagick 설치 (Mac의 경우 Homebrew:
brew install imagemagick) - 300 DPI로 단일 파일 변환:
convert -density 300 input.svg output.png - 특정 픽셀 크기로 변환:
convert -size 1000x1000 input.svg output.png - 폴더의 모든 SVG 일괄 변환:
for f in *.svg; do convert -density 300 "$f" "${f%.svg}.png"; done
ImageMagick은 자동화, CI/CD 파이프라인, 또는 대량의 SVG 파일 변환에 최적입니다.
방법 4: 온라인 SVG→PNG 변환기
소프트웨어 설치 없이 빠른 단발성 변환을 위해:
- Convertio (convertio.co): SVG 업로드, 출력 크기 설정, PNG 다운로드
- CloudConvert: 사용자 지정 너비/높이 및 DPI 설정 지원
- SVGtoPNG.com: 해상도 옵션이 있는 간단한 드래그 앤 드롭
온라인 도구는 단순한 로고와 아이콘에 잘 작동합니다. 사용자 정의 글꼴이나 복잡한 효과가 있는 SVG는 출력 품질을 확인하세요 — 일부 온라인 변환기는 모든 SVG 기능을 올바르게 처리하지 못합니다.
투명도: 배경 유지 또는 제거
SVG는 종종 투명한 배경을 가집니다. 각 방법의 처리 방식:
- Inkscape: 기본적으로 투명도 유지 — PNG도 투명한 배경을 가집니다
- ImageMagick: 투명도 유지. 흰색 배경을 추가하려면:
-background white -flatten을 명령에 추가 - 브라우저: 일반적으로 저장된 이미지에서 투명도 유지
- 온라인 도구: 대부분 투명도 유지 — 사용 전 출력 확인
투명도를 지원하지 않는 플랫폼을 위해 흰색 배경이 있는 PNG가 필요하다면, 내보낸 후 이미지 변환을 사용하여 배경을 추가하세요.
SVG→PNG: 기대할 수 있는 것
- 품질: PNG는 내보낸 크기에서 완벽하게 선명합니다 — 하지만 나중에 그 크기 이상으로 확대하면 흐릿해집니다
- 파일 크기: 단순한 로고의 1000×1000 px PNG는 일반적으로 10~100 KB. 색상이 많은 복잡한 SVG는 더 큰 PNG를 생성합니다
- 텍스트: SVG의 텍스트는 글꼴이 내장되어 있거나 아웃라인으로 변환된 경우 올바르게 렌더링됩니다. 그렇지 않다면 글꼴이 설치된 Inkscape 사용
- 그라디언트와 효과: SVG 그라디언트, 그림자, 필터는 Inkscape와 ImageMagick에서 잘 렌더링됩니다. 온라인 도구는 차이가 있습니다
변환 후 이미지 압축을 사용하여 눈에 보이는 품질 손실 없이 PNG 파일 크기를 줄이세요 — 웹 사용에 유용합니다.