HTML encode means converting special characters into HTML entities so browsers display them as text instead of interpreting them as code. For example, <div> becomes <div>. This guide explains what HTML encoding is, how to encode and decode entities step by step, the most common entities, and how to encode HTML in JavaScript, Python, and PHP.
Short answer: To HTML encode text online, paste it into a free HTML entity encoder and click Encode. Special characters like <, >, and & are instantly converted to safe entities like <, >, and &.
What Is HTML Encoding?
HTML encoding replaces characters that have structural meaning in HTML — or that are hard to type — with escape sequences the browser renders as the literal glyph. < becomes <, so the browser displays a less-than sign instead of starting a tag.
You need HTML encoding whenever you want to display code, user input, or special symbols inside a web page. Without it, raw angle brackets break your markup or open the door to XSS injection attacks.
There are three entity formats, and all work the same way:
| Format | Example | How It Looks |
|---|---|---|
| Named | < | Readable name |
| Numeric (decimal) | < | Character code |
| Hexadecimal | < | Hex code |
An HTML encoder typically uses named entities for the five essential characters and can handle all three formats when decoding.
How to HTML Encode Online
Follow these steps:
- Step 1: Open the free tool. Go to the HTML entity encoder. It runs entirely in your browser — nothing is uploaded.
- Step 2: Choose Encode mode. Select Encode to convert special characters into entities. (Choose Decode to convert entities back to plain text.)
- Step 3: Paste your text. Enter HTML snippets, code samples, user comments, or any text with special characters.
- Step 4: Click Encode. Your encoded text appears instantly in the output.
- Step 5: Copy the result. Paste it into your template, documentation, or HTML source.
Example:
Input: <div class="card">Tom & Jerry</div>
Output: <div class="card">Tom & Jerry</div>The tags are neutralized so the string displays as source code rather than rendering an actual div.
The 5 Essential Characters to Encode
At minimum, always encode these five:
| Character | Named Entity | Why It Must Be Encoded |
|---|---|---|
| < | < | Opens an HTML tag |
| > | > | Closes an HTML tag |
| & | & | Begins an entity reference |
| “ | " | Delimits attribute values |
| ‘ | ' | Can delimit attribute values |
Critical rule: encode the ampersand first. Every entity begins with &, so if you encode < to < and then encode ampersands, you will double-encode to &lt;. Good tools handle this ordering automatically.
Common HTML Entities Reference
Beyond the essentials, these entities cover symbols you will use often:
| Character | Named | Numeric | Description |
|---|---|---|---|
| © | © | © | Copyright |
| ® | ® | ® | Registered trademark |
| ™ | ™ | ™ | Trademark |
| € | € | € | Euro sign |
| £ | £ | £ | Pound sign |
| (non-breaking space) | |   | Non-breaking space |
| — | — | — | Em dash |
| – | – | – | En dash |
| • | • | • | Bullet |
| ° | ° | ° | Degree sign |
Named entities are readable but only exist for a defined list of characters. Numeric references work for any Unicode code point — each entity code maps to exactly one character. Browsers treat all three formats identically. (An HTML deobfuscator tool can help inspect heavily encoded content.)
How to Encode HTML in Code
For applications, encode programmatically instead of using a website.
JavaScript
function encodeHTML(str) {
return str
.replace(/&/g, '&')
.replace(/</g, '<')
.replace(/>/g, '>')
.replace(/"/g, '"')
.replace(/'/g, ''');
}Note the order: ampersand first. For decoding, use the browser’s built-in parser:
function decodeHTML(str) {
const el = document.createElement('textarea');
el.innerHTML = str;
return el.value;
}Python
import html
encoded = html.escape('<div>Tom & Jerry</div>')
# '<div>Tom & Jerry</div>'
decoded = html.unescape(encoded)PHP
$encoded = htmlspecialchars($input, ENT_QUOTES, 'UTF-8');
$decoded = htmlspecialchars_decode($encoded, ENT_QUOTES);htmlspecialchars encodes the five essential characters (the PHP equivalent of htmlspecialchars encode). Use htmlentities if you need to encode special symbols beyond those five. An encoder HTML tool handles the same five by default.
HTML Encode vs HTML Decode
| Encode | Decode | |
|---|---|---|
| Direction | Text → entities | Entities → text |
| Input | <div> | <div> |
| Output | <div> | <div> |
| Use case | Display code safely, prevent XSS | Edit stored content, inspect exports |
Use Encode when inserting untrusted or code-like text into a page. Use Decode when you need to read or edit content that was stored entity-encoded — for example, text from a CMS export or database dump. An HTML decode online tool reverses the process instantly, and htmldecode libraries do the same in code.
Common Mistakes to Avoid
Double-encoding ampersands. Encoding < again produces &lt;, which displays literally instead of as <. Always encode & first, or use a library that handles ordering.
Forgetting to encode in attribute values. <div title=”user input here”> needs encoding too. An unescaped quote in user input can break out of the attribute.
Thinking encoding stops all XSS. Entity encoding protects HTML element and quoted-attribute contexts. It does not protect JavaScript contexts, URL attributes like href, CSS, or unquoted attributes — each needs its own escaping rules. Pair encoding with a Content Security Policy.
Encoding everything unnecessarily. You don’t need to encode regular text. Only encode the five essentials plus any special symbols that could be misinterpreted. Over-encoding makes content harder to read in source.
Using encoding instead of framework escaping. If you use React, Vue, or a server-side template engine, rely on its built-in auto-escaping for production output. Manual encoding is for one-off tasks, documentation, and testing — not a substitute for framework-level protection.
Frequently Asked Questions
What is HTML encode?
HTML encode is the process of converting special characters into HTML entities so browsers display them as text rather than interpreting them as markup. For example, < becomes < and & becomes &. This lets you safely display code samples and user input inside web pages.
How to encode HTML in JavaScript?
Use a replace chain that handles the ampersand first: replace & with &, then < with <, > with >, ” with ", and ‘ with '. Or use a library. For decoding, set the string as innerHTML of a temporary element and read back its textContent.
Which characters must I encode?
At minimum: &, <, >, “, and ‘. Encode the ampersand first so you don’t re-encode entities you just created. These five cover the characters that can break HTML structure or enable injection.
What is the difference between named and numeric entities?
Named entities like © use readable labels but only exist for a defined character list. Numeric entities like © (decimal) or © (hex) reference the Unicode code point directly and work for any character. Browsers render all three identically.
Does HTML encoding prevent XSS?
In HTML text and quoted-attribute contexts, yes — encoded <script> tags display as text instead of executing. But encoding alone doesn’t protect JavaScript code blocks, event handlers, CSS, or URL attributes. Use context-appropriate escaping everywhere plus a Content Security Policy for defense in depth.
How do I decode HTML entities back to text?
Paste the entity-encoded text into a decoder tool and click Decode. Programmatically, Python’s html.unescape(), PHP’s htmlspecialchars_decode(), or the browser DOM trick (setting innerHTML and reading textContent) all reverse the encoding.
Conclusion
Encoding special characters is a fundamental skill for anyone working with web content — it keeps markup valid and users s
afe. Try the free HTML entity encoder now: paste your text and get clean entities instantly.
How to decode Base64 online free? Our step-by-step decoding guide walks you through it.

