About Base64 to Image

Decode base64 strings to viewable images. Part of the DevTools Surf developer suite. Browse more tools in the Images collection.

Use Cases

• Preview base64 image payloads from API responses during debugging
• Extract and download images embedded in JWT claims or database columns
• Verify email template inline images are correctly encoded
• Decode images embedded in HTML or CSS stylesheets

Tips

• Paste the full data URI (data:image/png;base64,...) or the raw base64 string — both formats are detected automatically
• Use the preview panel to verify the image decoded correctly before copying the binary or downloading
• The metadata display shows image dimensions, MIME type, and estimated file size from the base64 string length

Fun Facts

• Data URIs (data:...) were standardized in RFC 2397 in 1998. They were originally intended for small inline images but are now often used for fonts and SVGs in CSS to reduce HTTP requests.
• A base64-encoded image is about 33% larger than its binary equivalent because base64 uses 4 ASCII characters to represent every 3 bytes. For large images, HTTP/2 multiplexing makes separate requests more efficient than data URIs.
• The JPEG format, one of the most common image types encoded as base64, was standardized in 1992 by the Joint Photographic Experts Group and uses lossy DCT compression — the same technique used in MP3 audio.

FAQ

What image formats are supported?

Any image format whose MIME type is in the data URI or can be inferred from the base64 magic bytes: JPEG, PNG, GIF, WebP, SVG, BMP, ICO. The decoded image is shown in a preview canvas.

Should I embed images as base64 in CSS?

Only for very small images (under 5KB). Larger base64 images increase CSS file size, delay render-blocking CSS parse time, and defeat browser caching since the image cannot be cached independently.

Is there a size limit?

Most browsers handle data URIs up to ~2MB. Beyond that, some browsers truncate the URI or refuse to render it. For large images, use object URLs or separate HTTP resources instead.