Base64 Media Data URI Decoder
Preview and decode base64 image, audio and video data URIs.
Output appears here as you type — decoded on your device.
Input is processed on your device. Nothing you paste is sent anywhere.
What is the Base64 Media Data URI Decoder?
A Base64 media decoder converts a base64-encoded image, audio or video data URI back into the original file and renders a preview, so you can see what a base64 blob actually contains.
Media inlined into HTML, CSS, JSON or an API response arrives as a data URI: data:image/png;base64,iVBORw0KGgo... The prefix declares the MIME type, the base64 flag says how the payload is encoded, and everything after the comma is the file itself. Without a decoder it is an opaque wall of characters.
Rendering it locally answers the two questions that matter: what is this, and how big is it. Base64 adds roughly 33% to the file size, so an inlined hero image that looked convenient in development can be the reason a stylesheet ships half a megabyte.
The magic bytes at the start of the decoded data are also a useful check on the declared MIME type. iVBORw0KGgo is a base64-encoded PNG header, /9j/ marks a JPEG, R0lGOD a GIF — a mismatch between the declared type and the real signature is a common sign of a mangled payload or a deliberately mislabelled file.
Base64 Media Data URI Decoder at a glance
- Form
- data:<mime>;base64,<payload>
- Size overhead
- +33% versus the raw file
- PNG signature
- Base64 starts iVBORw0KGgo
- JPEG signature
- Base64 starts /9j/
How to use the Base64 Media Data URI Decoder
- 1Paste the full data URI, or just the base64 payload if you know the type.
- 2The media is rendered as a preview with its detected type and decoded size.
- 3Download the decoded file, or check the size before inlining it in production.
When you would reach for it
- Seeing what an inlined image in a stylesheet or JSON response actually is.
- Recovering an image from an API response or email source.
- Measuring the real byte cost of an inlined asset.
Base64 Media Data URI Decoder — frequently asked questions
Last reviewed · questions or corrections: contact@decoder.tools