도구 소개
SVG 경로 보기는 아이콘 윤곽과 복잡한 곡선을 확인하기에 좋습니다. 개별 경로 데이터를 붙여 넣거나 SVG에서 경로를 선택해 모양, 명령 수와 기하학적 경계를 확인한 뒤 별도의 정적 미리보기 파일을 만들 수 있습니다.
사용 방법
- SVG 모드에서 파일을 읽거나 경로 모드에서 d 속성의 경로 데이터를 붙여 넣으세요.
- SVG에서 확인할 경로를 선택하거나 입력한 개별 경로가 올바른지 확인하세요.
- 채우기 색상, 윤곽선 색상과 두께를 정하고 배경이나 배율을 조정하세요.
- 명령 통계와 기하학적 경계를 확인하고 필요하면 path-preview.svg를 다운로드하세요.
주요 기능
- M, L, H, V, C, S, Q, T, A, Z 등의 경로 명령을 지원합니다.
- 경로 명령 통계와 기하학적 경계를 표시하며 경로가 올바르지 않으면 구체적인 문제를 알려 줍니다.
- 적절한 여백을 두고 경로 범위에 맞게 미리보기를 표시합니다. 다운로드에는 보고 있는 경로와 선택한 스타일이 포함됩니다.
경로 명령과 경계 안내
- M은 시작점 이동, L·H·V는 직선, C·S는 3차 곡선, Q·T는 2차 곡선, A는 타원호를 나타내며 Z는 현재 하위 경로를 닫습니다. 소문자 명령은 일반적으로 상대 좌표를 사용합니다.
- 경계는 경로의 기하학적 모양을 기준으로 하며 윤곽선, 마커, 그림자나 필터는 포함하지 않습니다. 전체 SVG에서 가져온 경로는 상위 요소의 변환을 반영하지만 개별 보기에 원본의 모든 자르기와 조합 효과가 재현되는 것은 아닙니다.
- 아주 긴 경로도 통계를 확인할 수 있지만 항목이 많아 페이지가 느려지지 않도록 상세 명령 목록의 표시 개수는 제한됩니다.
SVG 안전 안내
미리보기에는 안전하게 처리한 정적 사본을 사용합니다. 스크립트, 클릭 이벤트와 애니메이션을 실행하지 않으며 외부 이미지, 글꼴과 스타일도 불러오지 않습니다. 외부 참조, 삽입된 웹페이지와 지원되지 않는 내용은 제거되므로 원본과 다르게 보일 수 있습니다. DOCTYPE이나 사용자 정의 엔티티가 포함된 문서는 지원하지 않습니다.
SVG 파일 또는 UTF-8 소스는 최대 2 MiB, 노드는 요소와 텍스트를 포함해 최대 20,000개, 중첩 깊이는 최대 96단계까지 허용됩니다. 내용이 너무 크거나 구조가 복잡하면 파일을 단순하게 정리한 뒤 사용하세요.
개인정보 보호
SVG 내용은 사용자의 브라우저에서만 처리되며 서버에 업로드되지 않습니다.
입력과 결과는 자동으로 저장되지 않습니다. 지우거나 페이지를 떠나기 전에 필요한 파일을 다운로드하고 원본 사본도 보관하세요.
자주 묻는 질문
SVG Path의 d 속성이란 무엇인가요?
d 속성은 경로 명령과 좌표를 담아 직선, 곡선, 원호와 닫힌 윤곽을 표현합니다.
M, L, C, Q, A는 각각 무엇인가요?
M은 시작점 이동, L은 직선, C는 3차 베지어 곡선, Q는 2차 베지어 곡선, A는 타원호를 뜻합니다.
Z는 무엇을 뜻하나요?
Z는 현재 하위 경로를 해당 하위 경로의 시작점까지 이어 닫습니다. 하나의 d 속성에 여러 하위 경로가 들어갈 수 있습니다.
경로 뷰어가 SVG 스크립트를 실행하나요?
아니요. 전체 SVG는 안전하게 처리하며 개별 경로 미리보기에는 올바른 경로 데이터와 선택한 정적 스타일만 사용합니다.