A data URI (or data URL) embeds file content directly as base64-encoded text in a string, using the format: data: ;base64, . They are commonly used in HTML, CSS, and API payloads.

What file types are supported?

Any file type with a valid base64-encoded data URI is supported — images (PNG, JPEG, GIF, WebP, SVG), PDFs, audio, video, JSON, plain text, and binary files.

No. The entire decode operation runs in your browser using the Web APIs. Nothing is ever sent to a server.

How do I get a data URI?

Data URIs appear in API responses, CSS background-image properties, HTML attributes, and exported assets. Use the File to Data URI tool on this site to create one from a local file.

What file types can this tool decode?

Any file type that can be expressed as a base64-encoded data URI: images (PNG, JPEG, GIF, WebP, SVG, AVIF), PDFs, audio files, video clips, JSON, plain text, fonts (WOFF/WOFF2), ZIP archives, and arbitrary binary data. The MIME type in the URI determines the file extension offered for download.

Why does the file size look 33 % larger than the base64 string length?

Base64 encodes every 3 bytes of original data into 4 ASCII characters, a 33 % overhead. So a 100 KB file produces a ~133 KB base64 string. After decoding, the downloaded file is back to its original unpadded size.

Can I decode a URL-safe base64 data URI?

Yes. The tool automatically normalises URL-safe characters (- back to +, _ back to /) before decoding, so JWTs and other URL-safe base64 payloads are handled transparently.

What happens if the data URI is malformed?

The tool shows a clear error message explaining what is wrong — for example, a missing mime type, a non-base64 payload marker, or invalid base64 characters. Paste the full string including the data: prefix and ;base64, segment.

Data URI to File

Decode a base64 data URI to the original file in one click — no server, no upload, full MIME detection and file preview.

Updated June 2026

Files never leave your browser

Data URI input

Files never leave your browser — all decoding happens locally.

All decoding runs in your browser. Nothing is uploaded to any server.

How to use Data URI to File

The Data URI to File tool decodes any base64-encoded data URI — images, PDFs, audio, JSON, fonts, or binary blobs — directly in your browser and gives you a one-click download. Paste a data:*;base64,... string from an API response, HTML source, or CSS file and retrieve the original file in seconds. Because all decoding uses the Web Crypto and Blob APIs locally, nothing is ever transmitted to a server, keeping your payloads completely private.

Copy the full data URI string from your source (API response, HTML attribute, or CSS file).
Paste it into the input field — the tool accepts any data URI starting with data: regardless of MIME type.
Click "Decode to File" to decode the base64 payload into the original binary.
Inspect the detected MIME type, file extension, and byte size shown in the result card.
Click the download button to save the decoded file with the correct extension.

Your data never leaves your device — 100% private processing.

What is a data URI and when is it used?

A data URI (also called a data URL) is a URI scheme defined by RFC 2397 that lets you embed binary file content as base64-encoded ASCII text directly inside a string. The format is data:<mimeType>[;charset=<encoding>];base64,<base64data>. Browsers originally introduced data URIs to embed small images in CSS and HTML without an extra HTTP request, avoiding a round-trip to a server. Today they appear widely in REST API responses that transmit files as JSON strings, in PDF generators that inline image assets, in JWT claims carrying embedded avatars or certificates, and in export formats from design tools. The main trade-off is size: base64 encoding inflates binary data by roughly 33 %, so data URIs are best reserved for small-to-medium assets.

Common data URI MIME types and their use cases
MIME type	Extension	Typical use
image/png	.png	Lossless images, logos, icons in CSS/HTML
image/jpeg	.jpg	Photographs embedded in API payloads or email HTML
image/svg+xml	.svg	Vector graphics in HTML templates
application/pdf	.pdf	PDF documents returned from document generation APIs
application/json	.json	JSON config or schema embedded in a larger payload
font/woff2	.woff2	Web fonts inlined in CSS @font-face for offline-first apps
audio/mpeg	.mp3	Short audio clips embedded in notification payloads

How base64 encoding works inside a data URI

The base64 algorithm maps every group of three input bytes to four ASCII characters drawn from a 64-character alphabet (A–Z, a–z, 0–9, +, /). If the input length is not a multiple of three, one or two = padding characters are appended. This means a data URI payload is always a multiple of four characters long and consists exclusively of printable ASCII — safe to embed in JSON strings, HTML attributes, and URL-encoded forms. The URL-safe variant (used in JWTs and some APIs) replaces + with - and / with _ and omits the trailing padding, so it can be used directly in a URL path or query string without percent-encoding. This tool handles both standard and URL-safe variants automatically.

Worked examples

Decode a PNG data URI

Inputs: data:image/png;base64,iVBORw0KGgo...

Result: .png file downloaded — MIME: image/png, ~1.4 KB

Decode a JSON data URI

Inputs: data:application/json;base64,eyJrZXkiOiJ2...

Result: .json file downloaded — MIME: application/json, 12 B

Glossary

Data URI: An RFC 2397 URI scheme that encodes file content as a base64 ASCII string prefixed with the MIME type.
MIME type: A two-part identifier (type/subtype) that tells browsers and APIs what kind of data a file contains, e.g. image/png or application/json.
Base64: A binary-to-text encoding that represents arbitrary bytes using a 64-character ASCII alphabet, adding roughly 33 % overhead.
Blob: A browser object that represents raw binary data. This tool converts the decoded bytes into a Blob so the browser can offer it as a download.
URL-safe Base64: A variant of base64 that substitutes + → - and / → _ and drops padding, so the string is safe to embed in URLs without percent-encoding.

Frequently Asked Questions

Free · No spam

Get weekly tool tips & updates

New tools, power-user tips, and productivity hacks — delivered free every Friday.

No spam, ever. Unsubscribe with one click.

Why use Data URI to File?

Decode any base64 data URI to its original file without a server round-trip
Automatic MIME type detection sets the correct file extension for download
Inline preview for images and PDFs before saving to disk
Handles URL-safe base64 (- and _ variants) transparently alongside standard base64
Works with any MIME type — images, PDFs, audio, fonts, archives, and binary blobs

Common use cases

Extract an embedded image from a REST API JSON response for offline inspection
Save a PDF returned as a data URI from a document generation API
Recover a font file inlined in CSS as a data:font/woff2;base64 string
Download a binary attachment from a webhook payload that encodes files as base64
Preview and verify an image data URI before embedding it in HTML or an email template

Related Developer Tools

File to Data URI

Upload any file and get a standards-compliant data URI instantly. Includes raw Base64, URL-safe Base64, and the full data URI — all in-browser and private.

Base64 Encoder & Decoder

Encode text or files to Base64, or decode Base64 strings back to text. Fast, free, and runs entirely in your browser.

Base64 Payload Extractor

Paste a JSON body, HTML source, or any text and automatically extract all embedded base64 data URIs. Preview, inspect, and download each artifact — fully in-browser.

JSON Formatter & Validator

Format, validate, and minify JSON instantly. Includes syntax highlighting, error detection, and a collapsible tree view — free, private, in-browser.

Regex Tester

Test and debug regular expressions online. See live matches, capture groups, and replace output. Free, private, instant.

URL Encoder / Decoder

Encode and decode URLs and URL components online. Convert special characters to percent-encoding and back instantly — free, private, and fast.

Explore all Developer Tools.