User Rating 0.0 ★★★★★

Total Usage 0 times

Category Code Utilities

Drop an image here or click to browse Supports BMP, PNG, JPG, GIF, WebP • Max 10 MB

Include Data URI prefix MIME line wrap (76 chars)

Is this tool helpful?

Your feedback helps us improve.

★ ★ ★ ★ ★

About

Base64 encoding converts binary image data into a printable ASCII string using a 64-character alphabet (A - Z, a - z, 0 - 9, +, /) with = padding. Every 3 input bytes map to 4 output characters, producing an output approximately 33% larger than the source. This overhead is the cost of safe transport through text-only channels: JSON payloads, CSS data: URIs, HTML <img> inline sources, and email MIME attachments. Misencoding a bitmap - truncating padding, using URL-unsafe variants where standard is expected, or neglecting the MIME prefix - results in broken images, silent render failures, or rejected API calls that waste debugging hours.

This tool parses the raw file header to extract metadata (dimensions, bit depth, color space) before encoding. It handles BMP, PNG, JPEG, GIF, and WebP formats. The encoder operates entirely in-browser with zero server round-trips, so proprietary or sensitive images never leave your machine. Limitation: files above 10MB are rejected to prevent browser memory exhaustion. For BMP files specifically, note that uncompressed 24-bit bitmaps at high resolution can be extremely large since BMP stores raw pixel data without compression.

Formulas

Base64 encoding maps every group of 3 input bytes (24 bits) into 4 printable ASCII characters (6 bits each). The output length is computed as:

L_out = 4 ⋅ ceil(L_in3)

where L_in = input byte length and L_out = output character count. The size increase ratio is therefore:

R = L_outL_in ≈ 43 ≈ 1.333

The encoding algorithm for each 3-byte group works as follows. Given bytes b₀, b₁, b₂:

i₀ = b₀ >> 2
i₁ = (b₀ & 3) << 4 | b₁ >> 4
i₂ = (b₁ & 15) << 2 | b₂ >> 6
i₃ = b₂ & 63

Each index i₀…i₃ maps to a character in the Base64 alphabet. When the input length is not divisible by 3, padding with = fills the remaining slots: 1 remainder byte produces 2 characters + ==, and 2 remainder bytes produce 3 characters + =.

For Data URI embedding, the full string format is:

data:MIME;base64,ENCODED_STRING

Reference Data

Format	Magic Bytes (Hex)	MIME Type	Compression	Typical Use Case	Max Colors	Transparency	Base64 Overhead
BMP	42 4D	image/bmp	None (RLE optional)	Windows system graphics, raw pixel editing	16.7M (24-bit)	32-bit BGRA only	~33%
PNG	89 50 4E 47	image/png	Deflate (lossless)	Web graphics, screenshots, icons	16.7M + alpha	Full alpha channel	~33%
JPEG	FF D8 FF	image/jpeg	DCT (lossy)	Photographs, web images	16.7M	None	~33%
GIF	47 49 46	image/gif	LZW (lossless)	Simple animations, low-color graphics	256	1-bit mask	~33%
WebP	52 49 46 46	image/webp	VP8/VP8L	Modern web optimization	16.7M + alpha	Full alpha channel	~33%
TIFF	49 49 / 4D 4D	image/tiff	Various	Print, archival, GIS	48-bit	Yes	~33%
ICO	00 00 01 00	image/x-icon	PNG/BMP inside	Favicons, Windows icons	16.7M	Yes	~33%
SVG	3C 3F 78 6D	image/svg+xml	Text (XML)	Vector graphics, logos	Unlimited	Yes	~33%
Base64 Alphabet Reference
Index 0-25	A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
Index 26-51	a b c d e f g h i j k l m n o p q r s t u v w x y z
Index 52-61	0 1 2 3 4 5 6 7 8 9
Index 62-63	+ / (Pad: =)
BMP Header Structure (First 54 bytes)
Offset 0-1	Signature		0x42 0x4D ("BM")
Offset 2-5	File Size		4 bytes, little-endian
Offset 10-13	Pixel Data Offset		Typically 54 for 24-bit, 1078 for 8-bit (palette)
Offset 18-21	Width (px)		4 bytes, signed int32
Offset 22-25	Height (px)		4 bytes, signed int32 (negative = top-down)
Offset 28-29	Bits Per Pixel		1, 4, 8, 16, 24, or 32
Offset 30-33	Compression		0 = BI_RGB (none), 1 = BI_RLE8, 2 = BI_RLE4

Frequently Asked Questions

Base64 maps every 3 input bytes to 4 ASCII characters. The ratio 4÷3 ≈ 1.333, meaning a 750KB BMP file produces roughly 1000KB of Base64 text. This overhead is unavoidable because you are trading binary density for text-safe transport. Line-break insertion (76-char MIME wrapping) adds another ~2% on top.

A raw Base64 string contains only the encoded characters (e.g., iVBORw0KGgo...). A Data URI prepends the MIME type header: data:image/png;base64,iVBORw0KGgo.... Browsers require the full Data URI to render inline images in <img src> or CSS background-image. Omitting the MIME prefix is one of the most common causes of broken inline images.

No. Base64 is a lossless encoding of the byte stream. The JPEG compression artifacts already exist in the source file. Base64 faithfully represents every byte, so decoding reproduces the exact same JPEG file. Quality loss only occurs during the original JPEG compression step, not during Base64 conversion.

BMP stores raw pixel data with no compression (BI_RGB mode). A 1920×1080 24-bit BMP requires 1920 × 1080 × 3 bytes + 54-byte header + row padding = approximately 5.93MB. PNG deflate compression typically reduces this to 1-3MB, and JPEG DCT lossy compression can reach 200-500KB.

Yes. Copy the Data URI output (including the data:image/...;base64, prefix) and paste it into an <img src="..."> attribute or a CSS url(...) value. Note that some email clients and older browsers impose size limits on Data URIs (commonly 32KB for IE8, no practical limit in modern browsers). For images above 50KB, serving the file via URL is generally more efficient due to HTTP caching.

The tool reads the first 12 bytes of the file (magic bytes) and matches them against known signatures: BMP (0x42 0x4D), PNG (0x89 0x50 0x4E 0x47), JPEG (0xFF 0xD8 0xFF), GIF (0x47 0x49 0x46), and WebP (0x52 0x49 0x46 0x46 with 0x57 0x45 0x42 0x50 at offset 8). This is more reliable than trusting the filename extension, which users can rename arbitrarily.