CSS 데이터 URI 변환기
스타일시트를 붙여넣거나, 파일을 선택하거나, 원격 CSS 파일의 URL을 입력하세요. 변환기가 모든 url(...) 참조를 찾아 크기 제한보다 작은 리소스를 내려받고 Base64 데이터 URI로 교체합니다.
| 리소스 | 크기 | 결과 |
|---|
CSS 이미지 인라인이 도움이 되는 경우
외부 이미지마다 요청이 하나씩 발생합니다. 작은 아이콘은 Base64 데이터 URI로 인라인하면 요청이 없어지고 깜빡임도 사라집니다. 몇 킬로바이트를 넘으면 33% 크기 증가와 캐시 손실이 이점보다 커지므로 변환기에 크기 제한이 있습니다. 결과를 gzip 또는 Brotli로 제공하면 Base64 오버헤드 대부분을 되찾을 수 있습니다.
자주 묻는 질문
모든 CSS 이미지를 인라인해야 하나요?
아니요. 작은 아이콘과 배경만 인라인하세요. 큰 이미지는 CSS를 비대하게 만들고 렌더링을 막으며 별도로 캐시할 수 없습니다.
댓글 (0)
“CSS 데이터 URI 변환기”에 대한 질문, 아이디어, 버그가 있으신가요? 댓글을 남기거나 도구를 평가하거나 다른 사람에게 답글을 달아 주세요.
아직 댓글이 없습니다. 첫 번째로 의견을 남겨 주세요!