이미지 Base64 변환
이미지 파일을 복사할 수 있는 Base64 문자열로 바꾸고, 바로 쓸 수 있는 HTML·CSS 코드도 받으세요.
이미지 Base64 변환은 이미지 파일을 Base64 텍스트로 인코딩해서 JSON, HTML 페이지, CSS 파일 안처럼 일반 텍스트로 저장하거나 보낼 수 있게 해 줘요. 문자열은 파일의 원래 바이트로 만들어지므로 이미지가 다시 압축되거나 바뀌지 않아요. 글자 수를 보여 주고, 이미지 전체가 담긴 HTML img 태그와 CSS background-image 규칙도 제공해요.
이미지 Base64 변환 사용 방법
- 1
이미지 열기
이미지 파일을 끌어다 놓거나, 선택하거나, 붙여넣으세요. 아이콘 같은 작은 이미지가 가장 좋아요.
- 2
Base64 문자열 받기
문자열이 글자 수와 대략적인 크기와 함께 바로 나타나요.
- 3
필요한 것 복사
문자열만 필요하면 Base64 복사를, 바로 쓸 수 있는 코드가 필요하면 HTML 복사나 CSS 복사를 클릭하세요.
- 4
코드에 붙여넣기
문자열을 JSON, HTML, CSS, 스크립트에 붙여넣으세요.
주요 기능
- 바이트 그대로 인코딩
- 원본 파일을 다시 압축하거나 화질을 바꾸지 않고 그대로 인코딩해요.
- 크기 정보
- 사용하기 전에 문자열의 글자 수와 대략적인 크기를 확인하세요.
- HTML·CSS 코드
- 전체 Data URI가 포함된 img 태그나 background-image 규칙을 복사하세요.
- 로컬에서 인코딩
- 파일은 브라우저에서 읽고 인코딩되며 업로드되지 않아요.
자주 묻는 질문
이미지에서 Base64는 어디에 쓰나요?
Base64는 바이너리 이미지 데이터를 일반 텍스트 문자로 바꿔요. 개발자는 작은 이미지를 HTML, CSS, JSON, 이메일 템플릿에 직접 넣어 별도의 이미지 파일을 불러오지 않아도 되게 할 때 써요.
Base64 문자열이 이미지 파일보다 큰 이유는 뭔가요?
Base64는 3바이트마다 텍스트 문자 4개를 쓰기 때문에 결과가 약 33% 커져요. 30 KB 이미지는 약 40 KB의 텍스트가 돼요.
Base64와 Data URI는 무엇이 다른가요?
Base64는 인코딩된 텍스트일 뿐이에요. Data URI는 data:image/png;base64, 같은 접두사를 붙여 브라우저가 파일 형식을 알 수 있게 해요. 이 도구는 문자열만 주고, 이미지 Data URI 변환은 전체 버전을 줘요.
큰 이미지도 Base64로 바꿔야 하나요?
보통은 아니에요. Base64는 아이콘 같은 작은 이미지에 가장 잘 맞아요. 큰 사진은 HTML이나 CSS를 훨씬 무겁게 만들고, 브라우저가 이미지를 별도 파일로 캐시할 수도 없어요.
인코딩하는 동안 이미지가 바뀌나요?
아니요, 원래 바이트를 인코딩해요. 유일한 예외는 iPhone HEIC 사진인데, 대부분의 브라우저가 HEIC를 표시하지 못해서 먼저 PNG로 변환해요.