SVG 변환기

CSS Background Synthesis

SVG 최적화
공백 및 주석 제거

Advanced Background Optimization

지능형 최적화

SVG 품질을 유지하면서 불필요한 공백, 주석 및 속성을 자동으로 제거하여 파일 크기를 최소화합니다.

다양한 형식 지원

필요에 따라 URL 인코딩 데이터 URI(더 작음) 또는 Base64 인코딩(호환성 좋음) 중 선택할 수 있습니다.

실시간 미리보기

생성된 SVG가 CSS 배경으로 어떻게 렌더링되는지 실시간으로 확인하여 완벽한 디자인을 보장합니다.

사용 방법

1

입력란에 SVG 코드를 붙여넣거나 입력합니다.

2

출력 형식을 선택하고 필요한 경우 최적화를 활성화합니다.

3

생성된 CSS 코드와 미리보기를 확인합니다.

4

프로젝트에 사용할 CSS를 복사하거나 다운로드합니다.

Technical Integration

Simply paste the generated CSS as a background-image property in your stylesheet. This allows you to use high-resolution, scaleable icons without external HTTP requests, improving performance and SEO.

FAQ

자주 묻는 질문

SVG Data URI란 무엇인가요?
Data URI는 data: 스킴을 사용하여 CSS 내부에 SVG 코드를 직접 삽입하는 방식입니다. 별도의 SVG 파일이 필요 없어 HTTP 요청을 줄일 수 있습니다.
Data URI와 Base64 중 어떤 형식을 사용해야 하나요?
일반적으로 URL 인코딩된 Data URI가 가독성이 좋고 크기가 작아 더 권장됩니다. 오래된 시스템이나 특정 도구와의 호환성이 필요한 경우에만 Base64를 사용하세요.
최적화가 SVG 품질에 영향을 주나요?
아니요! 최적화는 불필요한 공백, 주석, 중복 속성만 제거합니다. SVG의 시각적인 모습은 원본과 똑같이 유지됩니다.
어떤 SVG든 사용할 수 있나요?
네! 올바른 모든 SVG 코드에서 작동합니다. 다만, 이미지나 애니메이션이 포함된 매우 복잡한 SVG는 CSS 파일 크기가 커질 수 있습니다.