이미지 Base64 변환

data URI와 CSS·HTML 코드로 바로 복사

브라우저 내 처리

이미지

결과

아직 이미지를 올리지 않았습니다

이미지를 올리면 Base64 코드가 여기에 표시됩니다.

Base64로 변환하면 용량이 약 33% 늘어납니다. 작은 이미지에만 사용하세요.

작은 아이콘을 별도 파일로 두지 않고 CSS나 HTML 안에 직접 넣고 싶을 때 사용합니다. 요청 횟수를 줄일 수 있지만 용량이 약 33% 늘어나므로 작은 이미지에만 쓰는 것이 좋습니다.

언제 쓰는 게 좋나요?

10KB 이하의 작은 아이콘이나 로고에 적합합니다. 큰 이미지는 용량이 33% 늘고 브라우저 캐시도 활용할 수 없어 오히려 느려집니다.

이메일에 넣어도 되나요?

Gmail 등 일부 메일 클라이언트는 data URI 이미지를 차단합니다. 메일에는 일반 이미지 링크를 쓰는 편이 안전합니다.

SVG도 변환되나요?

가능하지만 SVG는 텍스트 형식이라 Base64 없이 코드를 직접 넣는 편이 용량 면에서 더 유리합니다.