> base64 | decode | PNG <
// Base64 문자열 및 데이터 URI를 PNG 이미지로 디코딩 — 알파 보존, 즉시 미리보기, 원클릭 다운로드
디코딩된 PNG가 여기에 표시됩니다
비트 완벽
디코딩된 PNG는 원본과 바이트 단위로 동일합니다 — 알파, 팔레트 및 색상 프로필 모두 그대로 왕복됩니다.
로컬 디코딩
Base64 페이로드는 브라우저에서 atob()로 디코딩됩니다. 서버 업로드 없음, PNG 바이트의 로깅 없음.
실시간 미리보기
다운로드하기 전에 디코딩된 이미지, 크기 및 대략적인 파일 크기를 즉시 확인하세요.
// BASE64 TO PNG 정보
이 도구가 허용하는 것
- >데이터 URI: data:image/png;base64,iVBORw0KGgo…
- >원시 PNG Base64 페이로드(iVBORw0KGgo로 시작)
- >공백 / 줄바꿈이 포함된 Base64
- >표준 RFC 4648 알파벳(+/, 선택적 = 패딩)
- >URL-safe Base64(-_) — 디코딩 시 자동 정규화
- >유니코드 인식 붙여넣기 — BOM 제거됨
일반적인 사용 사례
- >DOM 인스펙터의 데이터 URI에서 스크린샷 저장
- >데이터 URI CSS 배경에서 로고 추출
- >JSON API 응답에서 이미지 복구
- >데이터베이스 TEXT 열에서 이미지 복원
- >이메일 MIME 파트에서 PNG 복구
- >인라인 SVG 내부에 임베드된 아이콘 검사
- >손상된 <img src="data:image/png;base64,…"> 태그 디버깅
Base64 → PNG 디코딩 원리
디코더는 데이터 URI 접두사를 제거하고, 공백과 URL-safe 문자를 정규화한 다음, atob()를 호출하여 각 4문자 그룹을 다시 3바이너리 바이트로 변환합니다. 바이트 배열은 MIME 타입 image/png인 Blob으로 감싸지고, 객체 URL이 주어지며, <img> 요소에서 렌더링됩니다. Base64는 바이너리와 전단사이기 때문에 출력은 원본 PNG와 비트 단위로 동일합니다 — 디코딩된 파일의 SHA-256이 원본과 일치합니다.
PNG 데이터 URI 예시:
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8/5+hHgAHggJ/PchI7wAAAABJRU5ErkJggg==
성능 및 호환성
- >디코딩은 페이로드 길이에 대해 O(n) — 100 MB 이상도 문제없이 처리
- >네이티브 브라우저 atob() 사용 — 무거운 JS shim 없음
- >뷰어가 지원하는 경우 멀티 프레임 APNG 지원
- >모든 최신 브라우저(Chrome, Firefox, Safari, Edge)에서 작동
- >핀치 투 줌이 가능한 모바일 반응형 미리보기
- >다운로드는 Blob URL 사용 — 중간 서버 왕복 없음
// BASE64 → PNG 디코딩 방법
1단계: 붙여넣기
Base64 문자열이나 전체 데이터 URI를 입력 필드에 붙여넣으세요
2단계: 디코딩
[DECODE]를 클릭하세요 — PNG가 미리보기에 즉시 렌더링됩니다
3단계: 검사
저장하기 전에 크기, 파일 크기 및 알파 채널을 확인하세요
4단계: 다운로드
[DOWNLOAD .png]를 클릭하여 디스크에 비트 동일 PNG를 저장하세요
// 코드 예시 — BASE64 TO PNG
JavaScript (브라우저)
// Decode Base64 → PNG Blob → download link
const b64 = 'iVBORw0KGgoAAAANSUhEUg...';
const bin = atob(b64);
const arr = new Uint8Array(bin.length);
for (let i = 0; i < bin.length; i++) arr[i] = bin.charCodeAt(i);
const blob = new Blob([arr], { type: 'image/png' });
const url = URL.createObjectURL(blob);
window.open(url);원시 Base64 페이로드를 Blob으로 디코딩하고 엽니다. 전체 데이터 URI의 경우 <img> 태그가 직접 허용합니다.
Node.js
const fs = require('fs');
const b64 = 'iVBORw0KGgoAAAANSUhEUg...';
fs.writeFileSync('out.png', Buffer.from(b64, 'base64'));Node의 내장 Buffer를 사용하여 Base64를 디코딩하고 PNG 파일을 쓰는 한 줄.
Python
import base64
with open('out.png', 'wb') as f:
f.write(base64.b64decode('iVBORw0KGgoAAAANSUhEUg...'))표준 라이브러리만으로 — Base64 텍스트를 PNG 바이트로 다시 디코딩.
PHP
<?php
file_put_contents('out.png', base64_decode('iVBORw0KGgoAAAANSUhEUg...'));내장 base64_decode() 및 file_put_contents()를 사용하는 한 줄.
Shell (macOS / Linux)
echo 'iVBORw0KGgoAAAANSUhEUg...' | base64 -d > out.pngPOSIX base64 -d / -D는 stdin에서 텍스트를 읽고 stdout에 디코딩된 PNG를 씁니다.
// FAQ — BASE64 TO PNG
Q: Base64 → PNG 디코딩이란 무엇인가요?
A: Base64로 인코딩된 PNG를 원본 바이너리 형식으로 되돌립니다. 붙여넣는 문자열은 3 바이너리 바이트당 4 ASCII 문자입니다. 디코더는 한 번에 4자를 읽고, RFC 4648 알파벳 조회를 적용하고, 문자열이 소진될 때까지 그룹당 3바이트를 씁니다. 결과 바이트 배열은 일반 PNG가 허용되는 어디에서나 미리 보고, 저장하거나, 배포할 수 있는 완전하고 유효한 PNG 파일입니다.
Q: Base64 문자열이 정말 PNG인지 어떻게 알 수 있나요?
A: 모든 PNG의 처음 8바이트는 매직 서명 89 50 4E 47 0D 0A 1A 0A입니다. Base64로 인코딩될 때 해당 8바이트는 항상 iVBORw0KGgo로 시작합니다. 따라서 iVBORw0KGgo로 시작하는 Base64 문자열은 PNG입니다. 다른 형식은 다른 접두사를 가집니다: /9j/는 JPEG, R0lGOD는 GIF, UklGR는 WebP. 우리 디코더는 이 매직 접두사에서 PNG를 자동 감지하고, 데이터 URI에 MIME 타입이 있으면 해당 타입으로 대체합니다.
Q: 데이터 URI나 원시 Base64만 붙여넣을 수 있나요?
A: 둘 다 가능합니다. 문자열이 data:image/png;base64,로 시작하면 디코더가 접두사를 자동으로 제거합니다. 페이로드 부분만 붙여넣으면 매직 바이트에서 PNG MIME 타입을 추론합니다. 공백, 줄바꿈, 캐리지 리턴 및 탭은 디코딩 전에 정규화되므로 예쁘게 출력된 JSON 응답을 문제없이 붙여넣을 수 있습니다.
Q: 디코딩된 PNG가 손상되었습니다 — 왜인가요?
A: 일반적인 원인:
• 잘린 문자열 — Base64가 어딘가에서 잘렸습니다(예: 복사 소스의 줄바꿈 제한). 완전한 PNG Base64는 RU5ErkJggg==(IEND 청크)로 끝납니다. 이것이 누락되면 파일이 불완전합니다.
• URL-safe 알파벳 — 문자열이 +/ 대신 -_(base64url)를 사용하면 우리 도구는 정규화합니다. 다른 디코더는 거부할 수 있습니다.
• 이중 인코딩 — PNG가 두 번 Base64로 인코딩되었습니다. 다시 디코딩하세요.
• PNG가 아님 — 페이로드가 실제로 JPEG 또는 WebP입니다. 어떤 형식이든 자동 감지하는 일반 Base64 → 이미지 디코더를 사용하세요.
Q: PNG로 다시 디코딩하면 품질이나 투명도가 손실되나요?
A: 아니요. Base64는 비트 단위로 가역적인 변환입니다. 디코딩된 PNG는 원본과 바이트 단위로 동일합니다: 알파 채널, 팔레트(PLTE), 투명도(tRNS), 색상 프로필(iCCP/sRGB), 감마(gAMA) 및 물리적 픽셀 크기(pHYs) 모두 보존됩니다. 디코딩된 파일의 SHA-256 해시가 원본의 해시와 일치합니다. 차이가 보이면 변경은 인코딩 전에 발생한 것이지 Base64 왕복 중이 아닙니다.
Q: 터미널을 사용하여 Base64를 PNG로 디코딩할 수 있나요?
A: 예. macOS 및 Linux에서: echo 'iVBORw0KGgo…' | base64 -d > out.png
(macOS는 구 버전에서 -D를 사용합니다.)
Windows PowerShell에서: [IO.File]::WriteAllBytes('out.png', [Convert]::FromBase64String('iVBORw0KGgo…'))
문자열이 전체 데이터 URI인 경우 먼저 data:image/png;base64, 접두사를 제거하세요(대부분의 셸은 sed 's|^data:.*base64,||'를 허용합니다).
Q: Base64 PNG 입력은 얼마나 클 수 있나요?
A: 브라우저에서 디코딩하므로 제한은 장치의 메모리입니다 — 데스크톱에서 편안하게 100 MB 이상. 100 MB의 디코딩된 PNG는 약 135 MB의 Base64 텍스트가 필요하며, 대부분의 브라우저가 불평 없이 붙여넣습니다. 매우 큰 과학/의료용 PNG로 작업하는 경우 브라우저 atob() 성능이 메모리 한계 근처에서 저하되므로 서버 측 디코딩을 고려하세요.
Q: 이 디코더는 오프라인에서 작동하나요?
A: 예. 모든 디코딩은 네이티브 atob() + Uint8Array + Blob API를 사용하며, 이는 모든 최신 브라우저에 내장되어 있습니다. 페이지가 한 번 로드된 후에는 네트워크에서 연결을 끊고 계속 디코딩할 수 있습니다. 외부 서비스 없음, 서버 왕복 없음, 이미지 페이로드에 대한 분석 없음.
Q: Base64 PNG와 일반 PNG 파일의 차이점은 무엇인가요?
A: 정확히 같은 바이트를 포함합니다. 일반 .png 파일은 원시 바이너리이고, Base64 PNG 문자열은 동일한 바이너리를 64자 ASCII 알파벳으로 다시 쓴 것입니다. Base64 형식은 33% 더 크지만 HTML 속성, JSON 문자열, CSS url() 및 이메일에 삽입하기 안전합니다. 원시 PNG 바이트를 HTML에 넣을 수 없습니다 — null 바이트와 상위 비트 문자가 포함되어 텍스트 파서를 깨뜨립니다. Base64는 우회책입니다.
Q: Base64 PNG는 별도의 .png 파일보다 로딩이 빠른가요?
A: 매우 작은 이미지에만 해당됩니다. Base64는 HTTP 왕복 하나를 절약하여 새 연결에서 50–100 ms가 될 수 있습니다 — 4 KB 미만의 중요 UI 아이콘에 유용합니다. 더 큰 것의 경우 장기 캐시 헤더로 제공되는 별도의 .png 파일이 거의 항상 승리합니다. 왜냐하면 (a) gzip이 Base64 텍스트를 제대로 압축하지 못하고, (b) 데이터 URI는 독립적으로 캐시할 수 없으며, (c) HTML 파싱을 차단하기 때문입니다. 히어로 이미지가 아닌 스크롤 없이 볼 수 있는 영역의 마이크로 자산에 Base64를 사용하세요.
Q: 데이터를 어디에도 업로드하지 않고 Base64를 PNG로 디코딩할 수 있나요?
A: 예 — 이 도구는 100% 클라이언트 측에서 실행됩니다. Base64 문자열은 기기의 JavaScript에서 디코딩되고, 로컬에서 Blob으로 감싸지며, URL.createObjectURL()을 통해 표시됩니다. 아무것도 업로드되지 않습니다. 디코딩하면서 브라우저 개발 도구 네트워크 탭을 열어 이를 확인할 수 있습니다 — 요청이 나가지 않습니다. 전체 흐름을 오프라인(비행기 모드)에서 실행하는 것도 초기 페이지 로드 후 작동합니다.
Q: 프로덕션 코드에서 Base64를 PNG로 어떻게 디코딩하나요?
A: Node.js에서: fs.writeFileSync('out.png', Buffer.from(b64, 'base64')). Python에서: open('out.png','wb').write(base64.b64decode(b64)). Go에서: b, _ := base64.StdEncoding.DecodeString(b64); os.WriteFile("out.png", b, 0644). Java에서: Files.write(Path.of("out.png"), Base64.getDecoder().decode(b64)). Rust에서: std::fs::write("out.png", base64::decode(b64)?)?. PHP에서: file_put_contents('out.png', base64_decode($b64)). 모든 런타임의 표준 라이브러리에는 Base64 디코더가 포함되어 있어 — 서드파티 종속성이 거의 필요하지 않습니다.
Q: Base64 → PNG vs Base64 → JPG — 어떤 디코더를 사용해야 하나요?
A: Base64 문자열이 iVBORw0KGgo로 시작하면(또는 데이터 URI가 data:image/png;base64,라고 하면) Base64 → PNG를 사용하세요. 문자열이 /9j/4AAQ 또는 /9j/2wC로 시작하면 Base64 → JPG를 사용하세요. 확실하지 않다면 매직 바이트를 검사하고 올바른 형식을 자동으로 선택하는 일반 Base64 → 이미지 디코더를 사용하세요. 페이로드와 일치하지 않는 형식을 강제로 지정하지 마세요 — 디코딩된 파일은 유효한 바이트이지만 읽을 수 없습니다.