JPG를 SVG로 변환

JPG는 픽셀로 이루어진 격자이고 SVG는 도형을 설명하는 형식이라, 흐려지지 않고 어떤 크기로도 확대됩니다. 한쪽에서 다른 쪽으로 바꾸려면 트레이싱이 필요합니다. 비슷한 색의 영역 윤곽을 찾아 부드러운 벡터 경로로 바꾸는 작업입니다. 로고, 서명, 도장, 아이콘, 연필 스케치에는 아주 잘 맞고, 사진은 포스터 같은 도식화된 결과가 됩니다. 트레이싱은 모두 브라우저에서 이루어지며 파일은 기기 밖으로 나가지 않습니다.

사용 방법

1. JPG를 고릅니다(PNG와 WebP도 됩니다).
2. 선화에는 흑백을 쓰고 임계값을 정하며, 평평한 색이 몇 가지 있는 로고에는 컬러를 씁니다.
3. 가장자리가 너무 각지거나 너무 둥글면 디테일과 부드러움을 조절합니다.
4. .svg를 내려받아 브라우저, Inkscape, Illustrator, Figma에서 엽니다.

계산식

노이즈 제거(3 × 3 메디안) → 픽셀 분류(임계값 또는 k-평균 색) → 픽셀 경계 따라가기 → 더글러스–포이커 단순화 → 2차 베지어 곡선, 부드러움 각도보다 뾰족한 모서리는 유지.

JPEG 압축은 윤곽 둘레에 희미한 블록과 번짐을 남깁니다. 정리 과정을 거치지 않으면 SVG에 수백 개의 작은 점이 생기는데, 메디안 필터가 윤곽은 또렷하게 두면서 이를 없앱니다. 컬러 모드에서는 이웃한 도형 사이에 가는 틈이 생기지 않도록 가장 밝은 층부터 어두운 층 순으로 쌓습니다.

예시

흰 종이 위 서명을 찍은 1200 × 800 사진을 흑백 모드, 임계값 128, 디테일 보통으로 변환하면 이미지를 1000 × 667px로 트레이싱하고, 종이는 투명해지며 잉크는 하나의 경로 안의 채워진 도형이 됩니다. 보통 몇 KB에서 수십 KB의 작은 SVG가 되며 크게 인쇄해도 선명합니다.