래스터와 벡터는 이미지를 저장하는 서로 다른 두 방식이고, 그 차이를 알면 둘 사이를 언제 변환할지 정확히 알 수 있다. 래스터 이미지 — PNG, JPG, WebP — 는 색 있는 픽셀의 고정된 격자다. 벡터 이미지 — SVG — 는 지시의 집합이다. 이 경로를 그려라, 이 색으로 채워라, 이 원을 여기 놓아라. 벡터는 픽셀 대신 수학으로 도형을 기술하므로 어떤 크기에서도 선명하게 유지되고, 래스터는 원본 해상도 이상으로 밀리는 순간 흐려진다.
"래스터를 벡터로"는 추적을 뜻한다. 엔진이 픽셀을 읽고 그 안에 숨은 도형을 알아낸 뒤, 그 도형을 벡터 경로로 써낸다. 맞는 상황에서 하면 정말로 유용하다. 틀린 상황에서 하면 엉망이 된다. 이 가이드는 둘 다 다룬다.
추적이 잘 맞는 것
추적은 평평하고 가장자리가 깨끗한 입력을 원한다. 로고, 아이콘, 단순 일러스트, 선화, 손글씨. 이것들은 제한된 팔레트와 명확한 경계를 가져서, 추적기가 각 색 영역을 찾아 그 주위에 깔끔한 경로를 그릴 수 있다. 결과는 몇 개의 도형으로 이뤄진 콤팩트한 SVG다 — 어떤 배율에서도 선명하고, 파일 크기가 작고, 나중에 편집 가능하다. 목표가 파비콘부터 광고판까지 통하는 로고라면, 추적이 데려다준다.
사진이 안 맞는 이유
사진은 추적기가 원하는 것의 정반대다. 미묘하게 변하는 수천 가지 색과 뚜렷한 가장자리가 없는 연속 톤이다. 그것을 벡터화하려면 엔진이 모든 그라데이션을 겹겹이 포개진 단색 얼룩으로 근사해야 한다. 세 가지가 한꺼번에 잘못된다. SVG가 거대해져 종종 원본 JPG보다 몇 배 커지고, 사진 같지 않고 뭉개지고 포스터화된 것처럼 보이고, 수천 개의 의미 없는 도형으로 이뤄져 편집이 고통스럽다. 사진에는 래스터 포맷이 그냥 옳은 답이다 — 대신 JPG를 압축하거나 WebP로 변환하라. 벡터는 그래픽을 위한 것이지 사진을 위한 것이 아니다.
프리셋과 색상 수
추적기가 쓸 수 있는 색상 수가 결과를 좌우하는 가장 큰 지렛대다. 프리셋이 이를 설정해 준다. Flat / logo는 단순한 마크를 위해 색을 적게 유지하고, Detailed는 풍부한 일러스트를 위해 더 허용하고, Posterized는 이미지를 굵고 평평한 띠로 붕괴시키고, Black & white는 선화와 실루엣을 위해 모든 것을 두 톤으로 줄인다. 색이 적을수록 깨끗하고 작은 파일, 색이 많을수록 여분의 경로와 무게를 대가로 미묘함을 담는다. 같은 이미지에 두 프리셋을 시도해 전후 미리보기를 비교하는 것이 알맞은 균형을 찾는 가장 빠른 방법이다.
전부 로컬, 아무것도 업로드 안 됨
전체 변환이 imagetracer 엔진으로 브라우저에서 돌아간다. 이미지가 당신 자신의 기기에서 캔버스로 읽히고, 거기서 추적되어, SVG로 돌려진다 — 아무것도 업로드되지 않고, 계정도 없고, 페이지가 로드되고 나면 네트워크를 끈 채로 작동한다. 남의 서버에 보내고 싶지 않은 로고나 내부 그래픽에 가질 만한 가치다.
한 가지 분명히 할 것, "변환"이라는 말이 부르는 오해이니: 이것은 AI 재작화가 아니라 진짜 추적이다. 당신이 준 픽셀을 따르며 당신 작업물의 더 깨끗한 버전을 지어내지 않는다. 선명하고 평평하고 색 적은 원본은 선명한 결과를, 흐리거나 노이즈 많은 것은 흐리고 노이즈 많은 경로를 준다.
추적 후에
출력이 이름 붙은 경로와 채움의 표준 SVG이므로, 어떤 벡터 편집기 — Illustrator, Inkscape, Figma — 에서도 계속 작업할 수 있다. 채움 하나를 편집해 전체 영역을 다시 칠하고, 정확한 브랜드 색을 설정하고, 떠도는 도형을 제거하고, 경로를 조정하라. 그것이 벡터로 가는 요점이다. 이미지가 고정된 그림이기를 멈추고, 어떤 크기에서도 흐림 없이 당신이 소유하고 다시 만들 수 있는 객체가 된다.