HTML Entity Encoder / Decoder

About this HTML Entity Encoder / Decoder

The HTML Entity Encoder / Decoder converts text characters such as ampersands, angle brackets and quotes into HTML-safe entity representations, or decodes HTML entities back into readable characters. It is useful when preparing snippets and debugging escaped markup.

Certain characters like <, > , and quotation marks have special meaning in HTML markup, so encoding them as entities is necessary whenever you need those characters to display literally on a web page rather than being interpreted as part of the HTML structure itself.

For related tasks, try URL Encoder / Decoder, Base64 Encoder / Decoder or JSON Formatter & Validator.

How the calculation works

Encoding uses the browser DOM to produce entity-safe text. Decoding parses the entity string in a detached textarea element and returns its text value. No external service is required.

How to use it

1. Paste text or encoded HTML entities.
2. Choose Encode or Decode.
3. Copy the converted output.

Practical example

Encoding “<div>Tom & Jerry</div>” converts reserved markup characters so the text can be displayed rather than interpreted as HTML.

The text 5 < 10 and 10 > 5 must be encoded to display correctly and safely as literal text within an HTML page, since the raw less-than and greater-than characters would otherwise be interpreted as the start of HTML markup.

Things to double-check

Failing to encode special characters in user-generated content before displaying it in HTML is a common source of both broken page layouts and cross-site scripting (XSS) security vulnerabilities, so proper entity encoding is a genuine security practice, not just a cosmetic formatting concern.

Why entities are needed

Some characters have special meaning in HTML. The less-than sign starts a tag and the ampersand starts an entity, so to show them as text you write < and &. Greater-than is >, a double quote is " and an apostrophe can be '. Entities also let you type characters that are hard to enter, such as © for the copyright sign. The encoder converts text to entities and the decoder reverses it.

Safety against script injection

Encoding output is a main defence against cross-site scripting. If a page prints user input without encoding, someone can submit a script tag and run code in other visitors' browsers. Encoding turns the angle brackets into harmless text. Encode untrusted data at the point where you insert it into a page, and use the right context: text in an element, an attribute value and a script block need different treatment. Good frameworks do this automatically, but check when you build HTML by hand.

Named and numeric entities

An entity can be named, such as €, or numeric, such as € in decimal or € in hexadecimal. Numeric entities work for any Unicode character, while named ones exist for a limited set. The non-breaking space   stops a line from breaking between two words but should not be used for layout spacing. Encode the ampersand first when you do it manually, otherwise you will double-encode your own entities.

Decoding and common mistakes

Decoding turns entities back into characters, which is useful for reading text copied from page source or an API. Do not decode untrusted text and then insert it as HTML, since that can recreate a script tag. Double encoding, where &lt; appears instead of <, happens when text is encoded twice and shows as visible code on the page. If you see unexpected entity text on a page, check for an extra encoding step.

Entities in different places

Where the text goes decides what to encode. In normal HTML text, encode the less-than and ampersand characters. Inside an attribute value in double quotes, also encode the double quote, for example title equals quote He said "hi" quote. In a JavaScript string or a URL, entities do not apply and a different escaping method is needed. If you show a code example on a page, encode the angle brackets so that the browser displays the code instead of running it.

Worked examples

The text <script>alert("hi")</script> becomes <script>alert("hi")</script> when encoded, which a browser shows as the original characters instead of running the script. The text Tom & Jerry's becomes Tom & Jerry's. The ampersand must be encoded first when you do this by hand, otherwise you would change the ampersands that start the other entities. The converter handles the order for you, and decoding turns the entities back into the characters they stand for.

A common security scenario

Imagine a page that shows visitor comments. If a visitor submits text containing a script tag and the page prints it without encoding, the script runs in every other visitor's browser and could steal data. This is a cross-site scripting attack. The defence is to encode untrusted text at the point where it is output, using the method that suits the context: element text, attribute value, script or URL. Modern templating systems do this by default, but features that insert raw HTML, such as innerHTML in JavaScript, bypass it and need extra care.

Useful entities to know

Besides the special characters, a few entities are handy. The non-breaking space,  , keeps two words on the same line. © gives the copyright sign, ® the registered mark and ™ the trademark. € is the euro sign, — is a long dash, … is an ellipsis and → is a right arrow. Each has a numeric form, such as € for the euro, that works for any Unicode character. Today, saving files as UTF-8 and typing the characters directly is usually fine, and entities remain essential for the five special characters.

Troubleshooting double encoding

If you see text such as &lt; on a page, the content has been encoded twice, once by you or the editor and again by the system that outputs it. Check each stage: the database, the template and any plugin. The opposite problem, entities showing as raw text in an email or an RSS feed, can mean that the receiving system expects plain characters. When copying text from the page source, decode it first. Keep a note of where encoding happens in your project, so that each piece of text is encoded exactly once.

Key terms explained

An HTML entity is a code that stands for a character, starting with an ampersand and ending with a semicolon. A named entity uses a name, such as lt for less-than, and a numeric entity uses a number. Escaping means replacing special characters with safe codes. Cross-site scripting is an attack that injects code into a page. Sanitising removes dangerous parts of input. A character reference is the formal name of an entity. A non-breaking space prevents a line from breaking.

Rules of thumb and quick checks

The five characters to escape in HTML are the ampersand, less-than, greater-than, double quote and single quote. Escape the ampersand first when doing it by hand. Encode at the point of output and match the context: text, attribute, script or address. If you see ampersand amp semicolon on a page, the text was encoded twice. Never decode untrusted input and then insert it as HTML.

Quick reference and sanity checks

The five characters that most often need entities in HTML are the ampersand, written as &, the less-than sign, written as <, the greater-than sign, written as >, the double quote, written as ", and the apostrophe, written as '. When you encode by hand, convert the ampersand first, otherwise you will encode the ampersands of the other entities. Encoding twice produces visible text such as &lt; on the page, so encode once, at the point of output. When you show user input on a web page, escaping it is a basic defence against cross-site scripting, but you should also use the safe functions that your framework provides.

Frequently asked questions