SVG를 WebP로
SVG를 용량이 작은 WebP 이미지로 변환합니다. PNG나 JPG보다 빠르게 로드되고 날카로운 윤곽과 투명도도 유지되어 웹 아이콘과 로고에 좋습니다.
여기에 SVG 파일을 놓으세요
또는 클릭하여 파일 선택
SVG 그림을 WebP로 변환합니다. 같은 시각적 품질에서 PNG나 JPG보다 파일이 작으면서 날카로운 윤곽과 투명도도 지키는 형식입니다. 이 조합 덕분에 현대적인 웹사이트에서 아이콘과 로고의 기본 선택이 되었습니다.
WebP는 현재 모든 브라우저가 지원하므로 호환성 걱정은 사실상 과거의 일입니다. 아주 오래된 클라이언트까지 지원해야 한다면 PNG 대체 파일을 남겨 두고, 그렇지 않다면 WebP가 그냥 더 나은 파일입니다.
SVG를 WebP로 변환하는 방법
.svg 파일을 고릅니다
출력 크기와 품질을 지정합니다
WebP를 다운로드합니다
자주 묻는 질문
WebP가 어디서나 지원되나요?
현재 Chrome, Firefox, Safari, Edge에서 모바일을 포함해 모두 지원합니다. 아주 오래된 브라우저에만 PNG나 JPG 대체 파일이 필요합니다.
PNG보다 작나요?
대부분의 그래픽에서 눈에 띄게 작으며, 같은 시각적 품질에서 25~50% 정도 작은 경우가 많고 PNG라면 더 커질 투명도도 유지합니다.
WebP도 애니메이션이 되나요?
형식 자체는 애니메이션을 지원하지만, 이 변환기는 SVG에서 정지 이미지 한 장을 만듭니다.
사이트에서 어떻게 쓰나요?
다른 이미지와 똑같이 참조하면 됩니다. <img> 태그에 .webp 파일을 넣으면 바로 동작하고, 지원하는 브라우저가 알아서 사용합니다.
이미지 편집기에서 열리나요?
현재 버전의 Photoshop, GIMP, Affinity와 대부분의 코드 편집기가 WebP를 다룹니다. 아주 오래된 도구는 못 열 수 있으며, PNG 사본을 남겨 두는 주된 이유가 이것입니다.
제 파일이 업로드되나요?
아니요. 변환은 브라우저 안에서 기기 로컬로 이루어집니다.
한눈에 보기
| 입력 | SVG |
|---|---|
| 여러 파일 | 아니요 |
| 실행 위치 | 브라우저에서 실행 - 파일은 업로드되지 않습니다 |
| 오프라인에서도 작동 | 예 — 페이지를 불러온 후 |
| 가격 | 무료, 가입 필요 없음, 워터마크 없음 |
어떤 출력 형식을 고를까
SVG에서 시작해 비트맵이 필요하다면 답은 거의 항상 PNG입니다. 투명도를 유지하고 가장자리와 글자 주변에 압축 자국이 생기지 않으며, 표시 크기의 2배나 3배로 렌더링하면 선명하게 유지됩니다. JPG는 가능한 한 파일을 작게 만들어야 하고 지킬 투명도나 미세한 디테일이 없을 때만 고르십시오. JPG는 투명도를 전혀 표현하지 못하며 투명한 영역이 흰색이나 검은색이 된다는 점을 기억하십시오. 이미지를 웹사이트에 올리면서 투명도와 더 작은 파일을 모두 원한다면 WebP를 고르십시오. 무엇을 고르든 필요하다고 생각하는 것보다 높은 해상도로 내보내십시오. 큰 깨끗한 이미지를 줄이는 것이 작은 이미지를 늘리는 것보다 언제나 더 좋아 보입니다.
SVG 출력을 위한 실무 참고 사항
SVG는 텍스트이므로 내보낼 때 고른 해상도에 따라 확대됩니다. 표시하려는 크기의 2배나 3배로 렌더링하면 고밀도 화면에서도 선명하게 유지됩니다. 텍스트이기 때문에 압축과 캐시에도 유리하고 CSS로 꾸미거나 애니메이션을 넣을 수 있습니다. 주의할 점이 두 가지 있습니다. SVG 안의 텍스트는 폰트를 쓸 수 있는지에 의존하므로, 텍스트를 외곽선으로 바꾸면 어디서나 똑같이 보이는 대신 선택하거나 검색할 수 없게 됩니다. 또한 SVG는 스크립트와 외부 참조를 담을 수 있어 업로드 양식과 메일 클라이언트가 자주 거부합니다.