howToHeading
- '샘플 SVG 로드'를 클릭하여 중복 메타데이터가 포함된 디자인에서 내보낸 아이콘이 어떻게 간소화되는지 확인하거나 자신의 '.svg' 파일을 드래그하세요.
- Figma, Illustrator, Sketch 또는 코드 저장소에서 복사한 원본
<svg>코드를 입력 상자에 붙여넣을 수도 있습니다. - 보다 안정적인 기본 최적화를 위해 "표준"을 선택하십시오. 크기를 더 줄여야 할 경우 "Radical"로 전환하세요.
- "원래 볼륨", "최적화된 볼륨", "저장됨"을 확인하고, 오른쪽의 미리보기를 이용하여 그래프에 뚜렷한 변화가 없는지 확인합니다.
- HTML, React 또는 Icon 구성 요소와 함께 사용하려면 "SVG 코드 복사"를 클릭하고, 최적화된 파일을 저장하려면 "SVG 다운로드"를 클릭하세요.
예시 시나리오: 디자인 도구에서 내보낸 브랜드 아이콘을 도구에 붙여넣습니다. 저장 비율 및 미리보기 효과를 확인한 후 단순화된 인라인 SVG를 복사하여 웹 네비게이션 바 또는 버튼 아이콘에 사용합니다.
featuresHeading
- SVGO 기반 SVG 압축: 브라우저 측 SVGO를 사용하여 벡터 마크업을 압축하고 메타데이터, 빈 그룹 및 압축 가능한 속성을 제거합니다.
- Figma/Illustrator 내보내기 코드 정리: 디자인 도구로 내보낸 긴 SVG를 온라인 사용에 더 적합한 아이콘 코드로 변환하는 데 적합합니다.
- 실시간 볼륨 비교: 로딩 후 원래 볼륨, 최적화된 볼륨, 절약 비율이 표시되어 리소스를 교체할 가치가 있는지 빠르게 판단합니다.
- 코드 복사 또는 파일 다운로드: 한 번의 클릭으로 최적화된
<svg>태그를 복사하거나 새.svg파일을 다운로드하세요. - 로컬 처리로 디자인 자산 보호: 파일 읽기, SVGO 최적화, 미리보기 및 내보내기가 모두 현재 브라우저 내에서 완료되며 아이콘, 로고 또는 미공개 일러스트레이션이 업로드되지 않습니다.
relatedHeading
2026 최신 FIRE 재무 자유 계산기(물가상승률 반영). 브라우저 로컬에서 실제 구매력을 시뮬레이션하고, 은퇴 자금 부족액을 분석하여 연간 자산 계획을 세우세요. 엑셀이나 Notion 대시보드를 위한 CSV 원클릭 내보내기를 지원합니다.
계좌 잔고, 리스크 %, 진입가 및 손절가를 기반으로 트레이딩 포지션 규모를 계산하세요. 데이터 업로드 없이 브라우저 로컬에서 실행되므로 거래 전 리스크 시나리오를 비교할 수 있습니다.
초기 원금, 정기 투자액, 연간 수익률(APY) 및 투자 기간을 입력하여 복리 성장을 계산하세요. 브라우저 내에서 원금, 이자 및 최종 잔액을 인터랙티브 차트로 시각화합니다.
대출 계산기 / 모기지 계산기를 사용하여 브라우저 로컬에서 월 상환액, 총 이자 및 상환 일정표를 추정해 보세요. 대출 금액, 이자율 및 기간을 입력하면 차트와 함께 결과를 즉시 확인할 수 있습니다.
이 투자 계산기 / ROI 계산기를 사용하여 초기 원금, 매월 정기 투자액, 연간 수익률 및 물가상승률을 반영한 결과를 브라우저 로컬에서 추정하세요. 실시간 복리 차트, ROI 및 연간 세부 일정을 통해 예상 수익을 확인할 수 있습니다.
APR to APY Calculator를 사용하여 브라우저에서 로컬로 APR과 APY를 양방향 변환하세요. 금리를 입력하고 복리 주기를 선택하면 실효 연이율, 차이, 주기별 비교표를 즉시 확인할 수 있습니다.
이 이익률 계산기를 사용하여 브라우저 로컬에서 매출 총이익, 마크업, 마진 및 판매 가격을 계산하세요. 원가와 판매가, 또는 원가와 목표 마진을 입력하면 지표가 즉시 계산됩니다.
이 CPM 및 CPC 계산기를 사용하여 광고 비용, 노출수, 클릭수, CPM, CPC 및 CTR을 브라우저에서 로컬로 추정하세요. 예산과 목표 단가를 입력하여 캠페인 시나리오를 즉시 계획할 수 있습니다.
logicHeading
SVG 최적화는 벡터 이미지를 비트맵으로 변환하지 않지만 XML 벡터 마크업 자체를 정리합니다. 이 도구는 브라우저 측에서 실행되는 SVGO를 호출합니다. 일반적인 처리에는 편집기 메타데이터 삭제, 의미 없는 그룹 병합, 빈 속성 제거, 경로 압축 및 좌표 반올림이 포함됩니다.
"표준" 모드는 보다 보수적이며 대부분의 아이콘과 일러스트레이션에 적합합니다. "Radical" 모드는 여러 단계의 최적화를 가능하게 하며 더 짧은 수치 정밀도를 사용합니다. 크기는 더 작을 수 있지만 매우 복잡한 경로의 경우 미묘한 시각적 차이가 있을 수 있습니다. 이 도구는 SVG를 래스터화하지 않으며 여전히 복사 및 다운로드 가능한 벡터 코드로 최적화되어 있습니다.
faqHeading
SVG 파일의 크기를 줄이는 방법은 무엇입니까?
가장 일반적인 방법은 디자인 도구로 작성된 메타데이터, 빈 그룹, 중복 속성 및 압축 가능한 경로를 제거하는 것입니다. 이 도구는 SVGO를 사용하여 브라우저에서 이러한 최적화를 수행하고 절감 비율을 표시합니다.
Figma에서 내보낸 SVG 코드를 어떻게 정리하나요?
Figma에서 내보낸 .svg 파일을 도구로 드래그하거나 <svg> 코드를 직접 붙여넣습니다. 복사 또는 다운로드하기 전에 먼저 "표준" 모드에서 결과를 확인하고 미리보기가 정상인지 확인하는 것이 좋습니다.
SVG 압축으로 인해 이미지 품질이 저하되나요?
일반적으로 그렇지 않습니다. SVG는 벡터 마크업이며 SVGO는 주로 눈에 보이지 않는 메타데이터와 중복된 구조를 제거합니다. 그러나 매우 복잡한 경로는 "공격적" 모드에서 약간의 변경을 겪을 수 있습니다. 프로덕션 리소스를 교체하기 전에 미리보기를 시청하는 것이 좋습니다.
이 도구가 내 아이콘이나 일러스트레이션을 업로드합니까?
습관. 파일 읽기, SVGO 최적화, 미리보기, 복사 및 다운로드는 모두 브라우저에서 기본적으로 수행됩니다.
최적화된 SVG를 HTML에서 직접 사용할 수 있나요?
할 수 있다. 'SVG 코드 복사'는 HTML, React 구성 ��소 또는 아이콘 시스템에 인라인 처리하는 데 적합한 전체 <svg> 태그를 복사합니다.
PNG나 JPG를 SVG로 변환할 수 있나요?
할 수 없습니다. 이 도구는 기존 SVG 벡터 코드만 최적화하며 비트맵을 벡터로 변환하지 않습니다.