Base64 이미지 디코더이란?
Base64로 인코딩된 문자열을 다시 볼 수 있고 다운로드할 수 있는 이미지로 변환하는 디코더입니다. PNG, JPEG, GIF, WebP, AVIF, BMP, ICO, SVG 등 주요 이미지 형식을 모두 지원합니다.
data URI 접두사가 있든 없든 Base64 문자열을 붙여 넣으면 디코더가 바이트로부터 형식을 자동 판별합니다(PNG, JPEG, GIF, WebP, AVIF, BMP, ICO, SVG 지원). 미리보기 옆에는 가로·세로 크기, 바이트 단위 용량, 감지된 포맷, 입력 문자 수가 함께 표시되어 저장이나 복사 전에 내용을 확인할 수 있습니다.
사용 방법
- Base64로 인코딩된 이미지 문자열(Data URI 접두사 유무 무관)을 입력 필드에 붙여넣으세요.
- 디코딩된 이미지가 크기, 형식, 파일 용량 정보와 함께 즉시 표시됩니다.
- 디코딩된 이미지 파일을 다운로드하거나 클립보드에 복사하여 프로젝트에 활용하세요.
사용 시기
- API가 반환한 Base64 이미지가 실제로 기대한 사진으로 디코딩되는지 확인.
- HTML이나 CSS에 박혀 있는 data URI를 꺼내 실제 PNG 파일로 저장.
- 채팅이나 로그에 Base64 덩어리로 붙어 있는 스크린샷을 다시 열 수 있는 이미지로 복원.
결과
개발자가 API 응답에서 Base64로 인코딩된 PNG 스크린샷을 받았습니다. 문자열을 붙여넣어 이미지를 시각적으로 확인한 후 버그 리포트용으로 이미지 파일을 다운로드했습니다.
자주 묻는 질문
- 입력에 data:image/...;base64, 접두사를 반드시 포함해야 하나요?
- 필요 없습니다. 디코더는 순수 Base64 페이로드와 전체 data URI 모두를 받습니다. 본문만 붙여 넣으면 디코딩 직후의 첫 바이트(예: PNG는 89 50 4E 47, JPEG는 FF D8 FF)를 살펴 형식을 자동 선택합니다.
- 겉으로는 정상으로 보이는데 'Base64 유효하지 않음'이 뜨는 이유는?
- 조용히 일을 망치는 원인이 세 가지입니다. 페이로드 안에 끼어든 잉여 공백이나 HTML 엔티티로 변환된 줄바꿈, 워드프로세서에서 함께 따라온 곡선 따옴표, 그리고 data URI 접두사 자체가 다시 따옴표로 한 번 더 감싸진 경우입니다. URL-safe 변형(JWT에서 쓰는 하이픈과 밑줄 표기) 역시 자동으로 표준 알파벳으로 바꿔주므로 손으로 치환할 필요가 없어졌습니다. 페이로드 첫 글자 앞의 모든 문자를 지우고, 곡선 따옴표가 아닌 일반 ASCII만 붙여 넣었는지 확인해 보세요.
- 투명 배경의 PNG도 제대로 표시되나요?
- 네. 미리보기 영역은 중립 톤 배경을 사용해 투명 픽셀이 흰색으로 채워지지 않고 그대로 투명하게 보입니다. 다운로드한 파일은 알파 채널을 포함해 원본 PNG와 비트 단위로 일치합니다.
- 미리보기가 원본보다 흐릿하게 보이는 이유는?
- 미리보기는 컨테이너에 맞게 축소되지만 내부적으로는 실제 픽셀 크기로 디코딩되며 그 크기가 미리보기 옆에 표시됩니다. 브라우저 축소 없이 원본 해상도를 확인하려면 파일을 내려받아 이미지 뷰어로 열어 보세요.
- 붙여 넣을 수 있는 Base64 길이에 제한이 있나요?
- 페이지는 대략 25 MB의 텍스트, 즉 약 18 MB 분량의 바이너리 이미지까지 안정적으로 처리합니다. 그 이상은 브라우저가 메모리에서 디코딩하는 동안 끊김이 생깁니다. 4K 스크린샷이나 다중 페이지 PDF 같은 큰 자료는 파일로 직접 작업하는 편이 낫습니다.