Image to Base64 변환기
로컬 이미지를 Base64, data URL, CSS background, HTML img, Markdown 스니펫으로 업로드 없이 변환합니다.
Image to Base64 변환기 정보
로컬 이미지를 Base64, data URL, CSS background, HTML img, Markdown 스니펫으로 업로드 없이 변환합니다. FileReader로 브라우저에서만 읽어 스크린샷·로고·미공개 자산이 기기를 떠나지 않습니다. 반대로 data URL 또는 raw Base64를 붙여 미리보기 후 다운로드.
Image to Base64 변환기 사용 방법
- Image → Base64 선택. 파일 드롭·찾기 또는 Ctrl+V / Cmd+V 로 스크린샷 붙여넣기.
- 미리보기, MIME, 픽셀 크기, 원본 vs Base64 크기, 오버헤드 퍼센트(~33%) 확인.
- Data URL, raw Base64, CSS background-image, HTML img, Markdown 탭 복사. 업로드 없음.
- 역방향: Base64 → Image, data URL 또는 raw/URL-safe Base64 붙여 미리보기 후 다운로드(Blob으로 대용량도 저장).
Image to Base64 변환기 예시
CSS에 작은 아이콘 인라인
16x16 PNG 인코딩, CSS 탭에서 background-image: url('data:image/png;base64,...') 를 스타일시트·이메일 템플릿에 붙입니다.
스크린샷 붙여넣기
화면 캡처를 클립보드에 복사, 이 페이지 포커스 후 Ctrl+V / Cmd+V. 저장 대화상자 없이 즉시 인코딩.
로그의 data URL 디코드
data:image/webp;base64,... 를 Base64 → Image에 붙여 문자열만 있을 때 미리보기·다운로드.
Base64 오버헤드 확인
크기 패널에 원본 바이트, 인코딩 길이, 정확한 증가율로 인라인 여부 판단.
Image to Base64 변환기에 대한 자주 묻는 질문
- 이미지가 브라우저 밖으로 나가나요?
- 아니요. FileReader(readAsDataURL)로 인코딩. 업로드 엔드포인트 없음. DevTools Network에서 변환 시 파일 요청이 없음을 확인할 수 있습니다.
- 온라인에서 이미지를 Base64로 어떻게 변환하나요?
- 이미지 드롭·선택(또는 스크린샷 붙여넣기) 후 Raw Base64 또는 Data URL 탭 복사. 클라이언트 전용.
- Base64를 다시 이미지로 변환할 수 있나요?
- 예. Base64 → Image, data:image/...;base64,... (charset OK), raw Base64, URL-safe Base64(- _). 접두 없으면 magic bytes로 MIME 추정, 미리보기, Blob 다운로드.
- Base64가 약 33% 더 큰 이유는?
- 3바이트를 4 ASCII 문자로 인코딩해 텍스트가 약 1/3 커집니다. 크기 패널에 정확한 오버헤드 표시.
- 언제 Base64 인라인을 피해야 하나요?
- 큰 사진이나 CSS/HTML에서 ~100 KB 넘는 경우 - 캐시 차단·문서 비대화. 일반 image URL 선호. 작은 아이콘·이메일·오프라인 embed에 Base64.
- 어떤 형식을 지원하나요?
- 브라우저가 읽을 수 있으면 PNG, JPEG, GIF, WebP, SVG, BMP, ICO, AVIF. 파일당 소프트 한도 8 MB, FileReader 전 로컬 검사.
관련 도구
Base64 Encoder / Decoder
무료 온라인 Base64 encoder·decoder. 텍스트를 Base64로 인코딩하거나 Base64를 일반 텍스트로 디코딩합니다. Unicode(UTF-8) 전체 지원 - 브라우저에서만 실행.
Hash Generator
텍스트에서 SHA-256, SHA-1, SHA-384, SHA-512 해시를 생성합니다. HMAC도 같은 페이지에서. 브라우저에서 소문자 hex digest를 즉시 확인 - 업로드 없음.
CSS Minifier
무료 온라인 CSS minifier. 주석 제거·공백 축소로 CSS compress·minify - 더 작은 stylesheet, 더 빠른 로드. 브라우저 실행, 업로드 불필요.