PNG 파일을 SVG 형식으로 변환하면 일어나는 일
- 이미지를 디코딩한 뒤 이미지의 도형과 색상을 트레이싱한 SVG 파일로 기록합니다.
- 트레이싱은 비슷한 색의 영역을 벡터 도형으로 바꿉니다. 로고, 아이콘, 플랫 아트워크는 깔끔하게 트레이싱되어 어떤 크기로도 확대할 수 있지만, 사진은 모든 음영이 별도의 도형이 되므로 포스터화된 모습으로 나옵니다.
온라인에서 PNG 파일을 SVG 형식으로 변환하는 방법
- "PNG 파일 선택"을 누르고 파일을 하나 이상 선택하거나 상자로 끌어다 놓으세요. 기기 메모리에 담을 수 있는 크기라면 어떤 파일이든 추가할 수 있습니다.
- 필요하면 설정을 조정하세요. 출력은 무손실이므로 신경 쓸 품질 설정이 없습니다.
- "SVG 형식으로 변환"을 누르세요. 이미지는 한 장에 1~2초면 변환됩니다.
- 각 SVG 파일을 다운로드 버튼으로 저장하세요. 탭을 닫으면 파일의 모든 흔적이 메모리에서 사라집니다.
PNG 파일을 SVG 형식으로 변환하는 이유는?
PNG 파일은 보통 스크린샷, 로고, 다이어그램, 투명도가 있는 모든 것에서 나옵니다. SVG 형식은 어떤 크기에서도 선명하고 로고와 아이콘에서는 매우 작기 때문에 웹과 디자인 도구에서 그래픽의 표준이 되었으며, 그래서 사람들은 이를 SVG 형식으로 변환합니다.
요약하면 PNG 형식은 원래 만들어진 목적에는 잘 맞고, 파일을 다른 곳에서 열거나 업로드하거나 인쇄해야 할 때는 SVG 형식이 더 실용적입니다. PNG 파일은 모든 브라우저와 이미지 뷰어에서 열리는 반면, SVG 파일은 모든 브라우저에서 기본적으로 렌더링됩니다.
Windows, Mac, iPhone, Android에서 PNG 파일을 SVG 형식으로 변환하는 방법
Windows에서
Chrome, Edge 또는 Firefox에서 이 페이지를 열고 파일 탐색기에서 PNG 파일을 끌어다 놓은 다음 변환을 누르세요. 각 SVG 파일은 다운로드 폴더에 저장됩니다.
Mac에서
Safari, Chrome, Firefox 모두 사용할 수 있습니다. Finder에서 PNG 파일을 드롭 영역으로 끌어다 놓으면 SVG 파일이 다운로드 폴더에 저장됩니다.
iPhone 및 iPad에서
Safari에서 페이지를 열고 PNG 파일 선택을 탭하세요. 사진 앱이나 파일 앱에서 고를 수 있습니다. 변환된 SVG 파일은 파일 앱의 다운로드 폴더에 나타납니다. 사진 보관함에 넣으려면 그곳에서 파일을 열고 공유를 탭한 다음 이미지 저장을 선택하세요.
Android에서
Chrome에서 페이지를 열고 PNG 파일 선택을 탭한 다음 파일 앱이나 갤러리에서 파일을 고르세요. SVG 파일은 Download 폴더에 저장되며, 어떤 파일 관리자로도 찾을 수 있습니다.
PNG SVG 변환 최적 설정
트레이싱은 두 가지 설정으로 조절합니다. 색상은 SVG 파일에 쓸 수 있는 단색의 수를 정합니다. 2은 흑백 트레이싱으로 서명과 선화에 이상적이고, 8~16은 대부분의 로고에 알맞으며, 32는 음영을 더 많이 유지하지만 도형이 훨씬 많아집니다. 디테일은 윤곽선이 픽셀을 얼마나 가깝게 따를지를 정합니다. 높음은 작은 요소를 유지하고, 단순은 더 매끄럽고 가벼운 파일을 만듭니다.
가장 좋은 결과를 얻으려면 가지고 있는 이미지 중 가장 크고 깨끗하며 배경이 단색인 버전에서 시작하세요. 흐리거나 심하게 압축된 JPG는 트레이서가 압축 노이즈를 따라가기 때문에 가장자리가 들쭉날쭉하게 트레이싱됩니다.
PNG vs SVG: 차이점
| PNG | SVG | |
|---|---|---|
| 정식 명칭 | Portable Network Graphics(휴대용 네트워크 그래픽) | Scalable Vector Graphics(확장 가능한 벡터 그래픽) |
| 유형 | 이미지 | 이미지 |
| 개발 | PNG Development Group | World Wide Web Consortium |
| 최초 출시 | 1996 | 2001 |
| 압축 | 무손실 | 무손실 |
| 투명도 | 예 | 예 |
| 애니메이션 | 아니요 | 예 |
| 벡터 또는 래스터 | 래스터 | 벡터 |
| 색상 | 채널당 최대 16비트, 완전한 알파 채널 지원 | 모든 색상, 픽셀이 아닌 도형으로 표현 |
| 브라우저에서 | 모든 브라우저와 이미지 뷰어에서 열림 | 모든 브라우저에서 기본적으로 렌더링됨 |
| 주요 용도 | 스크린샷, 로고, 다이어그램, 투명도가 있는 모든 것 | 웹의 로고, 아이콘, 차트, 일러스트 |
| MIME 유형 | image/png | image/svg+xml |
PNG 및 SVG 파일 소개
PNG 파일이란?
PNG 형식은 픽셀 하나 잃지 않고 압축하므로 스크린샷과 텍스트가 아주 선명하게 유지되지만, PNG 형식으로 저장한 사진은 같은 사진을 JPG 형식으로 저장했을 때보다 3~5배 큰 경우가 많습니다.
SVG 파일이란?
SVG 형식은 도형을 텍스트 명령으로 기술하므로 어떤 크기에서도 선명하며, 단순한 로고는 5KB 미만일 수 있습니다. 픽셀로 바꾸면 하나의 해상도로 고정되므로 변환하기 전에 출력 크기를 선택하세요.
PNG SVG 변환이 안 되나요? 자주 발생하는 문제
- 색상이 약간 다르게 보입니다. 브라우저는 이미지를 디코딩할 때 표준 sRGB 색 공간으로 변환하므로, 넓은 색역 이미지와 CMYK 이미지는 조금 달라질 수 있습니다.
- 다른 곳에서는 옆으로 누워 보였던 휴대폰 사진이 똑바로 나옵니다. 이것이 올바른 결과입니다. 사진에 저장된 회전 정보가 변환 중에 적용되므로 SVG 파일은 항상 올바른 방향으로 나옵니다.
- 파일이 예상보다 큽니다. 아트워크에 따라 다릅니다. 단순한 로고를 SVG 형식으로 트레이싱하면 몇 킬로바이트인 경우가 많지만, 세밀한 이미지는 수천 개의 도형이 생겨 PNG 파일보다 커집니다. 색상이 적을수록 SVG 파일이 작아집니다.
명령줄에서 PNG 파일을 SVG 형식으로 변환
ImageMagick은 픽셀을 벡터 도형으로 트레이싱할 수 없으며, 이미지를 SVG 파일 안에 감쌀 뿐입니다. 표준 오픈 소스 트레이서는 흑백 비트맵에서 작동하는 potrace입니다:
magick input.png -threshold 50% input.pbm
potrace input.pbm -s -o output.svg이렇게 하면 단색 트레이싱이 됩니다. 컬러가 필요하면 이 페이지의 변환기가 아무것도 설치하지 않고 색상별로 따로 트레이싱한 뒤 합쳐 줍니다.
PNG SVG 변환기 자주 묻는 질문
PNG 파일을 SVG 형식으로 변환하면 품질이 떨어지나요?
SVG 파일은 복사본이 아니라 해석입니다. 트레이싱은 PNG 이미지를 도형으로 다시 만듭니다. 로고와 플랫 그래픽은 똑같아 보이고 어떤 크기에서도 선명하지만, 사진은 세부 묘사가 단순해집니다.
SVG 파일과 PNG 파일의 크기가 다른 이유는?
아트워크에 따라 다릅니다. 단순한 로고를 SVG 형식으로 트레이싱하면 몇 킬로바이트인 경우가 많지만, 세밀한 이미지는 수천 개의 도형이 생겨 PNG 파일보다 커집니다. 색상이 적을수록 SVG 파일이 작아집니다.
PNG 파일이 어딘가에 업로드되나요?
아니요. 변환은 브라우저 자체의 이미지 디코더를 사용해 이 브라우저 탭 안에서 실행되므로 파일은 기기에 그대로 남습니다. 페이지가 로드된 후에는 인터넷 연결을 끊어도 작동합니다.
여러 PNG 파일을 한 번에 SVG 형식으로 변환할 수 있나요?
예. 원하는 만큼 파일을 선택하거나 끌어다 놓으세요. 파일은 하나씩 차례로 변환되며 각각 다운로드 버튼이 생깁니다.
SVG 파일은 어떻게 여나요?
SVG 파일은 모든 브라우저에서 기본적으로 렌더링됩니다. SVG 형식은 웹의 로고, 아이콘, 차트, 일러스트레이션에 흔히 쓰입니다.
이 PNG SVG 변환기는 무료인가요?
예. 회원가입, 워터마크, 변환 파일 수 제한이 없습니다. 사이트는 광고로 운영되며, 변환이 사용자의 기기에서 실행되므로 파일당 서버 비용이 들지 않습니다.
휴대폰에서 PNG 파일을 SVG 형식으로 변환할 수 있나요?
예. 이 변환기는 iPhone과 iPad의 Safari, Android의 Chrome에서 작동합니다. 변환된 파일은 다운로드 폴더에 저장됩니다.