Convert JSON to a Data URI

Convert JSON to a Data URI turns your JSON content into a shareable, embeddable data: URI. These URIs are often used to embed small pieces of data directly into HTML or CSS, like storing configuration in a link or script without loading a separate file. With this tool, you can choose how the JSON is encoded using URI encoding or Base64 and decide whether to compact the output or keep it readable. Everything updates live in your browser.

Paste your input above or import a file below.
No file chosen
Supported file types: .json, .txt, .log, .csv, .tsv, .md, .html, .htm, .yaml, .yml
Total characters: 0
Options
URI Encode Output
Strip Whitespace
Base64 Encode

How to Use:

  1. Paste your JSON into the Input JSON box or import a file.
  2. In the Options panel:
    • Toggle URI Encode Output to escape special characters with percent codes.
    • Toggle Strip Whitespace to remove all indentation and line breaks.
    • Toggle Base64 Encode to encode the data portion using base64 instead of plain text.
  3. View the full Data URI live in the Data URI Output box.
  4. Use Copy Output or Export to File to save the result.
  5. Click Clear All to reset the tool.

What Convert JSON to a Data URI can do:

Convert JSON to a Data URI helps when you need to embed JSON directly into HTML links, scripts, or data attributes without external files. You can fine-tune the encoding style for compatibility with different use cases like using base64 for safe inclusion in headers or plain URI encoding for visibility. It’s lightweight, instant, and everything happens right in your browser.

Example:

Before:

{ "name": "Alice", "age": 30 }

With options:

  • URI Encode: On
  • Strip Whitespace: On
  • Base64: Off

After:

data:application/json,%7B%22name%22%3A%22Alice%22%2C%22age%22%3A30%7D

Common Use Cases:

Use Convert JSON to a Data URI when embedding configuration in QR codes, HTML anchors, or frontend scripts. It’s great for static demos, live previews, or sharing small payloads with no server required.

Useful Tools & Suggestions:

To prep the content, Stringify JSON should be run so everything becomes a proper string. Then, after generating the Data URI, URL encode JSON makes sure the result stays safe when embedded in code or shared online.

Related Tools