Convert Unicode to Data URL
Convert Unicode to data URLs with base64 or URL-encoding, 12 MIME types, charset toggle. Free, offline, client-side, instant, secure.
Encode Unicode text as a data URL for embedding directly in HTML src/href attributes, CSS url() values, or JavaScript constants. Two encoding modes (Base64 or URL-encoded), 12 MIME types, charset toggle, and a preview link to open the data URL in a new tab. Reverse direction parses any data URL back to text.
How to Use Convert Unicode to Data URL
- Paste your text. Anything Unicode - emoji, CJK, accented Latin. UTF-8 encoding is applied before any conversion, so multi-byte characters propagate correctly through both Base64 and percent-encoding.
- Pick a MIME type. 11 common options plus custom:
text/plain(default),text/html,text/css,text/javascript,text/csv,text/xml,application/json,application/xml,application/javascript,application/x-www-form-urlencoded,image/svg+xml. Custom lets you specify your own (e.g.,application/vnd.example+json). - Choose encoding. Base64 (default) - binary-safe, denser for non-ASCII content, prefixed with
;base64in the URL. URL-encoded - percent-encoding, more human-readable for plain text, smaller for ASCII-heavy content. Both yield valid data URLs. - Toggle charset. Default on: appends
;charset=utf-8to the MIME declaration. Off: omits it. Charset matters for text MIME types where browsers/parsers might default to a different encoding (e.g., text/html in Latin-1 mode). For binary or pre-encoded content, charset can be omitted. - Click Preview. Opens the data URL directly in a new browser tab - the most direct way to verify what your data URL actually renders as. For text/html, you'll see the HTML rendered. For text/plain, you'll see the text. For image/svg+xml, you'll see the SVG.
- Read the stats. Shows input character count, output URL character count, expansion percentage (Base64 typically expands content by ~33%, percent-encoding varies based on how many chars need escaping), MIME type, encoding, charset.
- Swap to decode. ⇄ flips to Data URL → Text. The parser splits on the first comma, parses the header (
data:<mime>[;charset=...][;base64]), detects encoding from the;base64flag, and decodes the payload accordingly. Works for any valid data URL - copy from any HTML/CSS source and paste it.
Frequently Asked Questions
When should I use Base64 vs URL-encoded?
Base64 is binary-safe and gives consistent length expansion (~33% larger). URL-encoded leaves ASCII characters alone but expands non-ASCII to 9 chars per UTF-8 byte (e.g., %C3%A9 for é). For ASCII-heavy text, URL-encoded is smaller and human-readable. For non-ASCII heavy content or binary data, Base64 is denser. Plain text in English is usually smaller URL-encoded; emoji-heavy or CJK text is smaller in Base64.
How can I embed a data URL in HTML?
Anywhere a URL is accepted: <img src="data:image/svg+xml;base64,...">, <a href="data:text/plain,...">, <iframe src="data:text/html;...">, CSS background: url("data:..."). Especially useful for self-contained pages, email templates (where external resources may not load), and tiny inline SVG icons.
Can I decode a data URL back to text?
Yes – click Swap. The parser handles any valid data: URL: extracts the MIME type, charset, and encoding flag from the header, then decodes the payload (Base64 or percent-encoded as indicated by the ;base64 presence). The stats show what the parser detected so you can verify the URL is what you expected.
What’s the difference between text/javascript and application/javascript?
Historically both were valid MIME types for JavaScript. application/javascript was the recommended type for years (per RFC 4329), but HTML5 specs now prefer text/javascript for script content (RFC 9239). For data URLs, both work – browsers accept either. Pick whichever matches your codebase convention or the consumer’s expectations.
Is there a size limit?
The tool caps at 500,000 input characters. Browsers vary: most accept data URLs up to a few MB in practice, though large data URLs slow page parsing and break some text editors that don’t handle long lines well. For content over ~10KB, consider a regular URL or Blob URL instead – data URLs work best for small inline content.
Why does Base64 expand my content?
Base64 represents 3 bytes (24 bits) of input as 4 ASCII characters (32 bits) – that’s a 33% size increase. Plus padding (=) for content not divisible by 3 bytes. So 100 input bytes becomes ~136 Base64 characters. Percent-encoding expands differently: ASCII-safe chars stay 1 char, special chars become 3 chars (%XX), multi-byte UTF-8 expands each byte to 3 chars.
What happens if I omit the charset?
The browser falls back to its default encoding for that MIME type. For text/plain and text/html, modern browsers usually default to UTF-8, but some older systems default to ISO-8859-1 or windows-1252. If your content has any non-ASCII characters, including the charset is the safest choice. For binary types like image/svg+xml, charset is moot.
What’s the difference between data URLs and Blob URLs?
Data URLs are immediate strings: the content is inline in the URL itself. Blob URLs (blob:https://...) are short references to in-memory content managed by the browser – you create them with URL.createObjectURL(blob). Data URLs are good for tiny content and email; Blob URLs are better for large content (no size cap, no expansion overhead) but tied to the page lifecycle.
Is my text uploaded anywhere?
No. All UTF-8 encoding, Base64 (btoa), URL encoding (encodeURIComponent), and decoding run in your browser. Open DevTools → Network and confirm zero requests fire – even when you Convert or Download. Safe for tokens, credentials, or sensitive content.
Does it work offline?
Yes. Total bundle is about 18 KB. Load once, disconnect, keep using. All conversion is pure JavaScript using browser standard library – no remote dependencies. Useful for embedding inline content on airgapped systems or when working with sensitive data you don’t want to expose to remote tools.