Base64 파일 변환기
어떤 파일이나 이미지든 Base64 데이터 URI로 인코딩하고, 데이터 URI를 다시 내려받을 수 있는 파일로 디코딩합니다.
Base64 파일 변환기 — 어떤 파일이나 이미지든 CSS나 HTML에 바로 붙여 넣을 수 있는 Base64 데이터 URI로 바꾸고, 반대로 데이터 URI를 클릭 한 번으로 원본 파일로 복원합니다. 모든 처리는 FileReader와 atob로 브라우저 안에서 100% 실행되므로, 드롭한 파일이 기기를 벗어나거나 서버로 업로드되는 일이 전혀 없습니다.
Base64 파일 변환기란?
Base64 파일 변환기는 바이너리 파일과 Base64 데이터 URI를 서로 변환하는 무료 브라우저 내 도구입니다. 웹 개발자는 작은 아이콘, 폰트, 이미지를 스타일시트와 마크업에 직접 인라인하여 네트워크 요청을 줄이는 데 사용하고, QA·지원 담당자는 길게 받은 데이터 URI를 디코딩해 파일을 복원하는 데 사용합니다. 인코딩에서는 파일을 드롭해 데이터 URI를 복사할 수 있고(원하면 CSS background-image 규칙이나 HTML img 태그로 미리 감쌀 수 있습니다), 디코딩에서는 데이터 URI를 붙여 넣어 복원된 파일을 내려받습니다. 입력 이미지와 디코딩된 이미지는 클릭하면 크게 볼 수 있는 미리보기로 표시됩니다.
Base64 파일 변환기 사용법
- 상단의 인코딩 / 디코딩 토글로 모드를 선택합니다.
- 인코딩하려면 업로드 영역에 파일(또는 이미지)을 드롭하거나 선택합니다. Base64 데이터 URI가 출력 칸에 즉시 표시됩니다.
- 설정을 열어 출력 형식을 고릅니다: 순수 데이터 URI, CSS background-image 규칙, 또는 HTML img 태그.
- 복사 버튼을 눌러 데이터 URI를 클립보드에 담습니다.
- 디코딩하려면 디코딩으로 전환한 뒤 데이터 URI를 텍스트 영역에 붙여 넣습니다. 미리보기와 파일 정보가 나타납니다.
- 다운로드 버튼을 눌러 복원된 파일을 기기에 저장합니다.
예시
작은 PNG 아이콘을 CSS에 인라인하기
인코딩 모드: 2 KB짜리 icon.png를 드롭하고 형식을 CSS로 설정한 뒤, background-image: url("data:image/png;base64,…") 규칙을 스타일시트에 바로 복사합니다.
데이터 URI로 받은 파일 복원하기
디코딩 모드: data:application/pdf;base64,… 문자열을 붙여 넣고 다운로드를 누르면 서버를 거치지 않고 report.pdf를 되찾을 수 있습니다.
사용하기 전에 Base64 이미지 미리 보기
디코딩 모드: data:image/jpeg;base64,… 문자열을 붙여 넣으면 이미지가 미리보기 자리에 렌더링되며, 클릭하면 라이트박스에서 원본 크기로 볼 수 있습니다.
자주 묻는 질문
- 어떤 종류의 파일을 인코딩할 수 있나요?
- 어떤 파일이든 가능합니다: 이미지, PDF, 폰트, 압축 파일, JSON, 일반 텍스트 등. 브라우저의 FileReader로 파일을 읽어 올바른 MIME 타입이 포함된 Base64 데이터 URI를 생성합니다.
- 왜 Base64 출력이 원본 파일보다 큰가요?
- Base64는 3바이트의 데이터를 4문자로 인코딩하므로 데이터 URI는 원본 파일보다 약 33% 큽니다. 이는 정상적인 절충이며 바이너리 데이터를 텍스트로 임베드하는 대가입니다.
- 디코딩하면 파일 이름은 무엇이 되나요?
- 도구가 데이터 URI에서 MIME 타입을 읽어 decoded.png나 decoded.pdf처럼 다운로드 이름을 정합니다. 타입을 알 수 없으면 .bin 확장자로 대체합니다.
- data: 접두사가 없는 순수 Base64 문자열도 디코딩되나요?
- 네. data: 헤더가 없는 순수 Base64를 붙여 넣으면 일반 바이너리 파일(application/octet-stream)로 디코딩되어 .bin 파일로 내려받을 수 있습니다.
- 제 파일이 어딘가로 업로드되나요?
- 아니요. 인코딩과 디코딩 모두 브라우저에서 전적으로 클라이언트 측에서 실행되며, 아무것도 업로드하지 않고 어떤 서버와도 통신하지 않습니다. 따라서 파일은 기기 안에서 비공개로 유지됩니다.