이미지 Base64 변환기란?

이미지 파일을 업로드하면 그 그림 데이터를 Base64 문자열과 바로 쓸 수 있는 data URI로 바꿔 주는 도구입니다. data URI는 data:image/png;base64,iVBORw0KGgo... 처럼 생긴 한 줄짜리 값으로, 이미지 파일을 따로 두지 않고 HTML이나 CSS 코드 안에 그림을 직접 심을 수 있게 해 줍니다. 별도 이미지 요청 없이 문서 하나로 그림까지 담고 싶을 때 씁니다.

지원하는 형식은 PNG, JPG(JPEG), WebP, GIF, SVG입니다. SVG는 벡터 정보를 지키려고 텍스트 그대로 읽어 인코딩합니다. 변환 결과와 함께 data URL, HTML <img> 예시, CSS background-image 예시가 자동으로 만들어져, 복사해서 그대로 붙여 넣기만 하면 됩니다.

사용 방법

1. 업로드 영역에 이미지를 끌어다 놓거나, 영역을 클릭해 파일을 고릅니다.
2. 파일을 선택하면 미리보기와 함께 변환이 자동으로 진행됩니다. 이미지 크기와 세로·가로 픽셀도 함께 표시됩니다.
3. 오른쪽에 나타난 Base64 문자열, data URL, HTML·CSS 예시 중 필요한 것을 복사해 사용합니다.

업로드 상한은 서버 설정을 따릅니다. 파일이 상한을 넘으면 안내 문구가 뜨며, 먼저 이미지 압축 도구로 용량을 줄인 뒤 다시 시도하면 됩니다. 또한 가로·세로 픽셀이 지나치게 큰 이미지는 처리에 많은 메모리가 필요해 변환이 거부될 수 있습니다.

결과를 코드에 넣는 방법

data URL 하나로 HTML과 CSS 양쪽에서 이미지를 파일 없이 표시할 수 있습니다.

작은 아이콘이나 로고를 인라인으로 심으면 이미지를 따로 불러오는 요청이 사라져 편리합니다. 다만 문서 크기가 커지고, 브라우저가 이미지를 따로 캐시하지 못한다는 단점이 있어 큰 그림에는 권하지 않습니다.

자주 묻는 질문

변환하면 파일 용량이 왜 더 커지나요?

Base64는 원본을 3바이트씩 묶어 4글자로 바꾸는 구조라, 결과 문자열이 원본보다 대략 30% 이상 커집니다. 이 도구는 원본 대비 몇 퍼센트인지 함께 보여 주니, 코드에 심기 전에 크기를 가늠할 수 있습니다.

Base64로 바꾸면 이미지가 암호화되나요?

아닙니다. Base64는 그림 데이터를 텍스트로 표현하는 방식일 뿐 암호화가 아닙니다. 누구나 원래 이미지로 되돌릴 수 있으므로, 감춰야 하는 이미지를 보호하는 용도로는 쓸 수 없습니다.

어떤 이미지에 인라인 방식이 맞나요?

작은 아이콘, 로고, 배경 패턴처럼 용량이 작고 자주 바뀌지 않는 이미지에 적합합니다. 사진처럼 큰 이미지는 data URI로 심으면 문서가 무거워지고 캐시 이점을 잃기 때문에, 일반 이미지 파일로 두는 편이 낫습니다.

업로드한 이미지가 서버로 전송되나요?

변환은 브라우저 안에서 파일을 읽어 처리하는 방식입니다. 업로드 영역은 파일을 고르는 창일 뿐, 그림을 화면에 불러와 Base64로 바꾸는 과정이 브라우저에서 이뤄집니다.

더 알아보기

data URL과 Base64가 실제로 어떻게 동작하고 왜 크기가 늘어나는지 원리를 더 알고 싶다면 Base64 인코딩 완벽 가이드를 참고하세요.

지원 형식·용량 표기는 도구 실제 동작 기준 · 마지막 검토: 2026년 7월 11일.