Free Data URL Converter

Turn any file or text into a data URL (a data: URI) you can paste straight into HTML, CSS or JSON, or paste a data URL to see what it contains and save it back as a file. Files are read in your browser and never uploaded.

Files

Text

Text is stored as UTF-8 and the data URL says so (charset=utf-8), so accents, other scripts and emoji survive.

Summary

A data URL converter turns a file or text into a data: URI, an address that carries the content itself, and turns a data URL back into the original file. To convert a file free and privately here, stay on File or text โ†’ data URL, click Choose files or drop them here, then press Copy data URL (every result also offers Copy as CSS url(); images add Copy as <img> tag). To decode, click Data URL โ†’ file, paste the data URL, press Decode and then Download file.

It runs in your browser; nothing is uploaded (you can check the Network tab in DevTools). The format, defined in RFC 2397, is data:[MIME type][;charset=โ€ฆ][;base64],content. Base64 writes 3 bytes as 4 characters, so a data URL is about 4 ร— ceil(bytes รท 3) characters plus the header: a 3,000-byte PNG becomes 4,022 characters, 34% larger.

Table of Use: Common Jobs and the Settings to Use

Data URL tasks, the tool settings to use and the output you get
JobSettingsOutput
Inline a small icon in HTMLFile or text โ†’ data URL, choose the PNG, then Copy as <img> tag<img src="data:image/png;base64,โ€ฆ" alt="">
Use an image as a CSS backgroundChoose the image, then Copy as CSS url()url("data:image/โ€ฆ")
Embed a JSON or HTML snippetText box, MIME type application/json or text/html, Encoding Base64, Convert textdata:application/json;charset=utf-8;base64,โ€ฆ
Put short text in a URLType Hello, world! in the Text box, MIME type text/plain, Encoding URL-encoded (percent), Convert textdata:text/plain;charset=utf-8,Hello%2C%20world!
Recover the file inside a data URLData URL โ†’ file, paste, Decode, Download filedecoded.png, decoded.pdf and so on, from the MIME type

Features

  • Any file to a data URL. Choose or drop several at once, of any type, up to 50 MB each; a larger file is skipped with a message naming it.
  • Text to a data URL with eight MIME types (text/plain, text/html, text/css, text/csv, application/json, application/javascript, image/svg+xml and application/xml) and Base64 or URL-encoded (percent) output. Every text data URL states charset=utf-8.
  • Size comparison on every result: the original size, the data URL size in characters, and how much larger or smaller it is.
  • Copy as a data URL, a CSS url() or, for images, an HTML img tag, or Download .txt. The box shows the first 2,000 characters of a long result, but Copy and Download use all of it.
  • Forgiving decoder. It reads Base64, URL-safe Base64 and URL-encoded data URLs, ignores line breaks and spaces inside Base64, and explains what is wrong when the text is not a data URL, has no comma or has invalid Base64.
  • Safe preview. Images show on a checkerboard so transparency is visible; audio and video get a player; text and HTML are shown as plain text (the first 100,000 characters) and are not run.

Limits: the tool does not compress or optimise anything, so shrink an image first, and a data URL suits small assets only. For SVG with a smaller data URI, the SVG to CSS converter offers minimal encoding and safe optimisation.

How to Use the Data URL Converter

  1. To encode a file, stay on File or text โ†’ data URL and click Choose files or drop them here. To encode text, type it into the Text box, pick the MIME type and Encoding, and press Convert text.
  2. Check Original against Data URL in the result card; the percentage tells you what the encoding costs.
  3. Press Copy data URL, Copy as CSS url(), Copy as <img> tag or Download .txt. Use Clear all or the โœ• to remove results.
  4. To decode, click Data URL โ†’ file, paste into Paste a data URL, press Decode, read the MIME type, size, encoding and charset, then press Download file.

Who Can Use It

Front-end developers inline small icons and tiny images so a page needs one request less, and people who build single-file HTML pages can embed fonts, images and snippets. Testers decode a data URL they were sent to see what it holds before opening it. Shrink the picture first with the image compressor or the image resizer, then check the markup that uses it in the HTML previewer and tidy the stylesheet with the CSS minifier.

For images only, the image to Base64 converter and the Base64 to image converter are focused alternatives. To encode plain text without the data: header, use the Base64 encoder and decoder, and for percent-encoding use the URL encoder and URL decoder.

FAQs

What is a data URL?

A data URL (or data URI) puts a whole file inside an address. It starts with data:, then the MIME type, an optional ;base64 flag and a comma, then the content, for example data:text/plain;charset=utf-8,Hello. Browsers treat it like the address of a file, so it works in an img src or a CSS url() with no separate download; a clicked link works only with the download attribute, because browsers block navigating to a data: URL.

How do I convert an image to a data URL?

With File or text โ†’ data URL selected, click Choose files or drop the image on the box. The data URL appears with a preview, both sizes and buttons: Copy data URL, Copy as CSS url(), Copy as <img> tag and Download .txt. Any file type works, up to 50 MB per file, and several files can be converted at once.

Why is the data URL bigger than my file?

Base64 writes every 3 bytes as 4 characters, so the length is 4 ร— ceil(bytes รท 3) plus the header, about 33% more than the file. A 3,000-byte PNG becomes 4,022 characters, 34% larger. The tool shows the original size, the data URL size and the percentage difference for every item.

Should I use Base64 or URL-encoded for text and SVG?

Try both and compare the sizes shown. This tool URL-encodes every character except letters, digits and - _ . ! ~ * ' ( ), so markup full of < > " and = grows: a 199-byte sample SVG icon is 308 characters as Base64 but 350 URL-encoded. Short plain text can come out slightly smaller URL-encoded. Binary files such as PNG or JPG always use Base64.

How do I turn a data URL back into a file?

Click Data URL โ†’ file, paste the data URL into Paste a data URL and press Decode. You see the MIME type, the size, the encoding and the charset, a preview for images, audio, video and text, and a Download file button that saves the original bytes as decoded.png, decoded.pdf or similar, with the extension taken from the MIME type.

Why does my text show strange characters like รƒยฉ when opened from a data URL?

A text data URL without a charset is read as US-ASCII, so UTF-8 accents and emoji turn into symbols such as รƒยฉ. Text converted here always includes charset=utf-8, which avoids the problem. When decoding, the tool uses the charset the data URL states and reads the text as UTF-8 if none is given.

When should I not use a data URL?

For large images or files used on many pages. A data URL cannot be cached separately and makes the HTML or CSS that contains it heavier, so it suits small icons, tiny images and generated content. Larger files are usually better served as normal files. Shrink an image before embedding it to keep the string short.

Are my files uploaded?

No. This tool runs in your browser and nothing is uploaded (you can check the Network tab in DevTools). Files are read by your browser, text is converted on the page, and decoding happens there too. Nothing you choose, paste or type is sent to ZipConvert or anyone else.