HTML to Base64

Encode HTML to Base64 or data URLs and decode Base64 back to HTML.

0 chars
0 words
0 lines
0 chars
0 words
0 lines

HTML to Base64 Encoder and Data URL Generator

Encode HTML markup to Base64 and turn it into a data:text/html;base64,... URL, or decode Base64 back into readable HTML. The conversion is UTF-8 safe and happens entirely in your browser.

A complete web page inside a URL

A data URL carries the document itself instead of pointing to a server. Encode a snippet, enable Output as data URI, and you get something like data:text/html;base64,PGgxPkhpPC9oMT4=, which is simply <h1>Hi</h1>. Paste it into the address bar and the browser renders the page. This is useful for quick prototypes, sharing a reproducible bug demo in an issue, or keeping tiny self-contained tools as bookmarks.

Embedding HTML in other documents

  • iframes – <iframe src="data:text/html;base64,..."> shows sandboxed content without an extra file or a srcdoc attribute full of escaped quotes.
  • Email – HTML parts in MIME messages are often sent with Content-Transfer-Encoding: base64; use the 76-character line wrap to match the standard.
  • JSON and APIs – CMS exports, email-template APIs, and PDF rendering services frequently expect the HTML body as a Base64 field so quotes and angle brackets don't need escaping.
  • Test fixtures – store HTML snapshots in YAML or environment variables as one clean line.

Decoding HTML

Found a long PCFET0NUWVBFIGh0bWw+... string in a log, an email source, or an API response? It starts with PCFET0NUWVBF, which is <!DOCTYPE in Base64. Switch to Base64 to HTML, paste it (with or without the data: prefix), and the original markup appears, ready to download as an .html file.

Security notes

Base64 does not sanitize anything: scripts inside the HTML still run when the data URL is opened, so never render untrusted decoded HTML. Browsers also block links that navigate to data URLs to reduce phishing. If you only need to show markup as text, use HTML Escape / Unescape instead. For stylesheets see CSS to Base64.

Frequently Asked Questions

Chrome, Firefox, Edge, and Safari block top-level navigation to data: URLs from web pages to stop phishing. You can still paste the URL into the address bar yourself, use it as the src of an iframe, or open it from a bookmark.

Include <meta charset="utf-8"> in the HTML, as in the sample, or change the prefix to data:text/html;charset=utf-8;base64,. Otherwise some browsers may guess a different encoding and show accented characters or emoji incorrectly.

Yes. MIME allows Content-Transfer-Encoding: base64 for text/html parts. Enable 76-character line wrapping to follow the MIME line length limit. Many mail libraries do this automatically, but it's useful for hand-built or debugged messages.