Data URI Handler
Create or decode Base64 data URIs for embedding files.
About Data URI Handler
The Data URI Handler lets you encode any file into a Base64 data URI for direct embedding into HTML, CSS, or JavaScript, and decodes existing data URIs back to their original file content. Data URIs follow the RFC 2397 format `data:[<mediatype>][;base64],<data>`, allowing assets to be inlined without additional HTTP requests. Inlining small assets like SVG icons, fonts, or tiny images can meaningfully reduce page load latency for critical resources. All encoding, decoding, MIME-type detection, and file preview happens entirely in your browser with no server upload required.
How to Use
To encode, upload a file or paste raw text and select the correct MIME type from the dropdown — the tool generates the complete RFC 2397-compliant data URI string ready to paste into src, href, or url() attributes. To decode, paste an existing data URI into the input field and click Decode to extract the embedded content, preview images or SVGs inline, and download the original file. All processing is client-side, so your files never leave the browser.
Common Use Cases
- Frontend developers embedding small SVG icons, spinners, or UI images directly in HTML or CSS to eliminate additional HTTP requests and reduce critical rendering path latency
- Email template designers inlining custom web fonts and logo images as Base64 data URIs in CSS style blocks to ensure consistent rendering in clients that block external resource loading
- Security researchers decoding suspicious data URIs found in phishing HTML attachments or obfuscated script tags to reveal the hidden payload content
- Web developers creating fully self-contained single-file HTML demos, offline documentation pages, or portable tool widgets that embed all assets inline
- Build tool authors generating Base64-encoded background image data URIs for CSS-in-JS styled components or generating inline SVG data URIs for icon fonts