이미지 Base64 변환 온라인

이미지 파일을 Base64 문자열로. Data URI, Raw, CSS background, HTML img 태그까지 형태별로 뽑아줘요.

이미지를 여기에 놓으세요 또는 클릭하여 선택

이미지를 Base64 문자열로 즉시 변환합니다

Preview
혹시 원하시는 툴이 아니신가요? 챗봇 질문하기로 원하시는 툴을 찾아보세요

이미지를 Base64로 바꾸는 법

  1. 업로드 - 이미지를 드래그하거나 클릭해서 선택.
  2. 출력 형식 선택 - Data URI / Raw / CSS / HTML 중에 필요한 걸로.
  3. 복사 - 복사 버튼 클릭하면 클립보드로 바로.

이 변환기의 특징

  • 형식 4종 - Data URI, Raw Base64, CSS background, HTML img 태그 한 번에.
  • 파일 정보 표시 - 원본 용량, Base64 변환 후 크기, 증가율까지 확인 가능.
  • 개인정보 안전 - 파일이 브라우저 밖으로 안 나가요.
  • 즉시 변환 - 업로드 대기 시간 없이 바로.

이미지를 Base64 문자열로

아이콘 같은 작은 이미지를 별도 파일로 호스팅하지 않고 HTML·CSS 코드 안에 통째로 박아 넣고 싶을 때 쓰는 방법이에요. 그렇게 하면 브라우저가 이미지 파일을 따로 요청 안 해도 되니까 HTTP 요청 수가 줄고, 로딩이 조금 빨라지거든요.

이메일 뉴스레터 작업할 때도 유용해요. HTML 메일에 이미지를 Base64로 박아 넣으면 외부 호스팅 없이도 이미지가 보이니까요. 올린 이미지를 복붙할 수 있는 Data URI, CSS 배경, HTML img 태그 형태로 각각 뽑아줘요.

다른 Base64 변환기랑 비교

기능FreeToolboxBase64-Image.deBase64Guru
출력 형식4종 (URI, Raw, CSS, HTML)2종3종
개인정보브라우저 전용서버 업로드서버 업로드
파일 정보아니요기본만
속도즉시업로드 대기업로드 대기

자주 묻는 질문

이미지를 왜 Base64로 바꾸나요?

주로 세 가지 경우예요. 하나는 작은 아이콘을 HTML/CSS에 인라인으로 박아서 HTTP 요청 수를 줄이는 거, 둘은 HTML 이메일에 외부 호스팅 없이 이미지를 포함시키는 거, 셋은 JSON/API 응답에 이미지 데이터를 같이 담는 거요.

Base64로 바꾸면 용량이 커지나요?

네, 약 33% 정도 늘어나요. 그래서 10KB 이하의 작은 아이콘·썸네일에 쓰는 게 좋고, MB 단위 큰 사진은 그냥 일반 이미지 파일로 쓰는 게 효율적입니다.

Data URI랑 Raw Base64, 뭐가 다른가요?

Data URI는 'data:image/png;base64,...' 접두사가 붙어 있어서 HTML이나 CSS에 그대로 복붙하면 바로 작동해요. Raw Base64는 그냥 순수 인코딩 문자열만 있는 형태라서, 어딘가에서 디코딩할 때 직접 처리해야 돼요.

사진이 서버로 전송되나요?

아니요. FileReader API로 브라우저에서 처리돼요.

어떤 포맷까지 지원하나요?

브라우저가 열 수 있는 건 대부분 다 돼요. JPG, PNG, WebP, GIF, SVG, BMP 등.