HTML to Base64
Encode HTML code as a Base64 Data URL. Instantly generate iframe embed code, browser download links, and JavaScript examples — no server required, embed or distribute HTML directly in the browser.
Output
Typical Use Cases
iframe Sandbox Embed
Embed independent HTML content inside a page without extra HTML files or server endpoints. Commonly used for code previews, online editors, and in-document demos.
<iframe src="data:text/html;base64,…" sandbox></iframe>Browser-side File Download
Use an anchor tag with the download attribute and a Data URL to generate an HTML file and trigger a download entirely in the browser — no server needed. Ideal for "Export" in online editors.
<a href="data:text/html;base64,…" download="page.html">Download</a>Email Inline HTML
Some email clients support embedding Base64-encoded HTML content directly in the message body, without relying on an external server — suitable for offline reading.
Content-Type: text/html; charset=UTF-8
Content-Transfer-Encoding: base64Chrome Extension / Electron
Dynamically inject HTML content into a Chrome extension popup or Electron app using a Data URL, avoiding file system permission issues.
webContents.loadURL(`data:text/html;base64,${b64}`)Four Output Formats
The tool uses TextEncoder to convert the HTML string to UTF-8 bytes before Base64 encoding, correctly handling Chinese, emoji, and other Unicode characters.
Data URL
The complete data:text/html;base64,… string, usable in any HTML attribute that accepts a URL.
iframe Embed
A complete iframe tag with a sandbox attribute — paste it into any page to embed the HTML content.
Download Link
An anchor tag with a download attribute — clicking it triggers the browser to download the HTML as a file, no server required.
JS Code
Complete code examples including a UTF-8-safe encoding function, dynamic iframe creation, download trigger, and a Node.js version.
iframe sandbox Attribute Reference
sandboxMost restrictive — disables all scripts, forms, and pop-ups
sandbox="allow-scripts"Allows JavaScript execution
sandbox="allow-same-origin"Allows access to resources from the current origin
sandbox="allow-forms"Allows form submission
sandbox="allow-popups"Allows opening new windows
Frequently Asked Questions
Can an HTML Data URL be used directly in an iframe src?
Yes, data:text/html;base64,… is a valid iframe src. However, modern browsers (especially Chrome 60+) have restricted navigation to data: URLs, and data: URLs nested in non-top-level frames may be blocked. It is recommended to add the sandbox attribute and only enable the required permissions (such as allow-scripts and allow-same-origin) for better security and compatibility.
Is there a length limit for HTML Base64 Data URLs?
URLs have no hard limit in theory, but browsers and operating systems impose practical constraints. Chrome limits data: URLs to roughly 2 MB, and large HTML files may load slowly or be truncated. HTML under 512 KB is suitable for Data URLs; larger files should be served through a server.
Why encode HTML to Base64 instead of using a file link?
When you need to distribute HTML in an environment without a server — such as email embeds, Chrome extensions, or Electron apps — a Data URL is very useful. It embeds a complete HTML page as a single string, requiring no file system access or network requests.
Is encoding correct when the HTML contains Chinese or special characters?
The tool uses TextEncoder to convert the HTML string to UTF-8 bytes before Base64 encoding, fully supporting Chinese, emoji, and other Unicode characters. Remember to include the charset=UTF-8 meta declaration in your HTML to ensure the browser decodes it correctly.
Does the download attribute work in all browsers?
The download attribute is supported in all modern browsers (Chrome, Firefox, Edge, Safari 14+). For data: URLs, Safari had limited support in early versions, but Safari 14 and later work correctly. IE 11 does not support this attribute.
How do I encode HTML to Base64 in Node.js?
const b64 = Buffer.from(htmlString, "utf-8").toString("base64"). To generate a Data URL: const dataUrl = "data:text/html;base64," + b64. To decode: const html = Buffer.from(b64, "base64").toString("utf-8").