홈 › 디자인

글자를 SVG 경로로 변환

글자를 쓰면 바로 벡터로 바뀌어요. 글꼴 라이선스가 로고·상업용을 허락하는지 꼭 확인하세요.

파일은 서버로 전송되지 않고 내 기기에서만 처리돼요
옵션

글자를 ‘그림’으로 굳혀야 할 때

로고 시안이나 간판 문구를 SVG로 보냈는데 상대 컴퓨터에 그 글꼴이 없으면 전혀 다른 글꼴로 바뀌어 보여요. 커팅 플로터(실루엣 카메오·크리컷), 레이저 각인기, CNC, 자수 프로그램은 아예 글자를 이해하지 못하고 선(경로)만 읽어요. 그래서 디자인 프로그램에서는 마지막에 ‘윤곽선 만들기(Create Outlines)’를 해요. 이 도구는 그 작업을 프로그램 설치 없이 브라우저에서 해 줘요.

쓰는 법

어떻게 바꾸나요

오픈소스 fontkit(MIT)으로 글꼴 파일을 읽고, 글자 배치(커닝·합자 같은 OpenType 기능 포함)를 계산한 뒤 글자마다 글꼴에 저장된 윤곽선(2차·3차 베지어 곡선)을 그대로 꺼내 위치·크기를 맞춰 SVG path로 써요. 글꼴 안의 원래 곡선을 쓰기 때문에 아무리 키워도 매끄럽고, 화면 렌더링을 따라 그리는 방식(이미지 추적)보다 훨씬 정확해요.

라이선스 주의

기본으로 들어 있는 Noto Sans KR·Noto Serif KR은 SIL 오픈 폰트 라이선스(OFL)라 윤곽선 변환과 로고·상업용 사용이 자유로워요. 내 글꼴 파일을 쓸 때는 그 글꼴의 라이선스가 로고 사용, 윤곽선 변환, 제품 제작을 허락하는지 꼭 확인하세요. 무료 글꼴이라도 ‘로고 사용 금지’인 경우가 있어요. 글꼴 정보는 글꼴 파일 정보에서 볼 수 있어요.

참고한 자료

자주 묻는 질문

일부 글자가 빈칸으로 나와요.

고른 글꼴에 그 글자가 없어서 그래요. 아래에 없는 글자를 알려 주니 다른 글꼴을 골라 보세요.

커팅 프로그램에서 글자 속(ㅇ, ㅁ 안쪽)이 메워져요.

프로그램이 경로 방향을 무시하는 경우예요. ‘한 개의 path로 합치기’를 켠 SVG를 쓰거나, 프로그램에서 ‘복합 경로(Compound Path)’로 만들어 주세요.

글꼴이나 글자가 서버로 가나요?

아니요. 이 기기 브라우저 안에서만 변환해요.

함께 쓰면 좋은 도구