이 이미지 ↔ Base64 도구 소개
방향 1: 이미지를 선택하면 HTML, CSS, JSON에 바로 붙여 넣을 수 있는 data:image/…;base64,… 형식의 Data URL이 생성되고 인코딩된 크기도 표시됩니다. 방향 2: 전체 Data URL 또는 순수 Base64 문자열을 붙여 넣으면 형식이 자동으로 인식되어 이미지가 미리보기로 표시되고, 잘못된 입력은 조용히 실패하지 않고 명확한 오류로 알려 줍니다.
인코딩은 FileReader를, 디코딩은 브라우저 기본 Base64 엔진을 사용하며 아무것도 업로드되지 않습니다. Base64는 크기를 약 33% 늘린다는 점을 유의하세요. 작은 아이콘과 장식 요소는 인라인으로 넣고, 큰 사진은 별도 파일로 유지하는 것이 좋습니다.