WebToolsPlanet
could be injected into a page and execute as code — this is a Cross-Site Scripting (XSS) attack. Encoding converts < to <, preventing the browser from treating it as a tag start. OWASP identifies XSS as one of the most critical web security risks. Entity encoding is the primary mitigation."}},{"@type":"Question","name":"What is the difference between named and numeric HTML entities?","acceptedAnswer":{"@type":"Answer","text":"Named entities use a memorable name: & < > "   © é — more readable in HTML source. Numeric entities use a number: & < > ’ — work for any Unicode character even if no named entity exists. Numeric hex entities (&) are also valid. Modern browsers support all formats; use named entities for readability."}},{"@type":"Question","name":"When should I use   (non-breaking space)?","acceptedAnswer":{"@type":"Answer","text":"  is a space that never breaks (a line won't wrap at this space). Use it to: keep specific words together (e.g., \"Dr. Smith\"), create intentional whitespace in HTML where normal spaces are collapsed (e.g., in table cells), or for minimum spacing in some email clients. Don't use it as a paragraph spacing technique — use CSS margin/padding instead."}},{"@type":"Question","name":"Do I need to encode all characters, or just the dangerous ones?","acceptedAnswer":{"@type":"Answer","text":"For XSS prevention, you only need to encode the 5 HTML-special characters: < > & \" '. Most modern frameworks (React, Angular, Vue) auto-encode these when you use template syntax. Full encoding (converting every non-ASCII character to entities like é) is only needed for old HTML 3.2 compatibility or specific character sets. UTF-8 HTML pages can include most Unicode characters directly."}},{"@type":"Question","name":"Does React / Vue / Angular automatically handle HTML encoding?","acceptedAnswer":{"@type":"Answer","text":"Yes! React's JSX (and other major frameworks) automatically HTML-encode all content rendered via template syntax: React JSX uses {variable}, Vue uses {{ variable }}, Angular uses {{ variable }}. All of these are safe by default. Vulnerabilities arise only when you explicitly use dangerouslySetInnerHTML (React), v-html (Vue), or [innerHTML] (Angular) without sanitization."}},{"@type":"Question","name":"What is the difference between HTML encoding and URL encoding?","acceptedAnswer":{"@type":"Answer","text":"HTML encoding (this tool) makes text safe to place inside HTML documents — converts & to &, < to <. URL encoding (percent-encoding) makes text safe for URL parameters — converts & to %26, space to %20. Use HTML encoding for HTML content; use URL encoding (encodeURIComponent() in JavaScript) for URL query string values."}}]}
text Tools

HTML Entity Encoder / Decoder

Convert special characters to HTML entities (& → &amp;) and decode them back — for safe, valid HTML.

Last updated: March 25, 2026

Client-Side Processing
Input Data Stays on Device
Instant Local Execution

Find this tool useful? Support the project to keep it free!

Buy me a coffee

What is HTML Entity Encoder / Decoder?

HTML entity encoding converts characters that have special meaning in HTML into safe escape sequences that browsers display as literal characters without parsing them as markup. The most critical characters are < (less-than, starts HTML tags), > (greater-than, ends tags), & (ampersand, starts entities), and " (double-quote, delimits attribute values). Without encoding, these characters break HTML structure and can create serious security vulnerabilities.

HTML entity encoding is the primary defense against Cross-Site Scripting (XSS) — the most common web security vulnerability. When user-submitted content is displayed in a web page, any < in the input could be the start of a <script> tag injected by an attacker. Encoding it to &lt; ensures the browser displays a literal < character rather than treating it as markup. This tool encodes any text to safe HTML entities and also decodes entities back to readable text.

How to Use HTML Entity Encoder / Decoder

1

Paste the text you want to encode (or HTML with entities you want to decode) into the input

2

Click "Encode" to convert special characters to HTML entities

3

Or click "Decode" to convert HTML entities back to their original characters

4

Choose encoding mode: Named (&amp;, &lt;) or Numeric (&#38;, &#60;) — named is more readable

5

Copy the encoded/decoded result with the Copy button

Common Use Cases

  • Safely displaying user-submitted text content in HTML pages (XSS prevention)
  • Encoding code snippets containing < and > for display in HTML articles or documentation
  • Preparing text content containing & and " for safe injection into HTML attributes
  • Decoding HTML-encoded content from third-party APIs or CMS systems
  • Encoding text before embedding in HTML email templates
  • Preparing SQL or JSON data containing special characters for output in HTML
  • Fixing HTML pages with "broken" & characters that should be &amp;
  • Encoding mathematical symbols (≤ ≥ ≠ ÷ × √) for cross-browser HTML display

Example Input and Output

Encoding user-submitted content that contains HTML special characters:

Raw user input (dangerous in HTML)
<script>alert('XSS')</script>
Tom & Jerry's "Favorite" Café
Price: $10 < $20 & discount > 5%
HTML-encoded output (safe for HTML)
&lt;script&gt;alert(&#x27;XSS&#x27;)&lt;/script&gt;
Tom &amp; Jerry&#x27;s &quot;Favorite&quot; Caf&eacute;
Price: $10 &lt; $20 &amp; discount &gt; 5%

Privacy First

All encoding and decoding runs locally in your browser. Your text — which may contain sensitive content, code, or user data — is never transmitted to our servers.

Security Context Matters

HTML entity encoding is sufficient when inserting content into HTML text context (<p>content here</p>). For other contexts, different encoding is needed: URL encoding for URL parameters, JavaScript encoding for JS strings, and CSS encoding for style values. Using HTML encoding in a JavaScript context (e.g., inside a <script> tag) does not prevent XSS.

Framework Auto-Escaping

If you're building with React, Vue, or Angular — template variables are automatically encoded. Only decode or bypass encoding when you intentionally need to render HTML markup from trusted, sanitized sources. Never pass raw user input to dangerouslySetInnerHTML or innerHTML without running it through a sanitizer like DOMPurify first.

Frequently Asked Questions

Why is HTML entity encoding important for security?
Without entity encoding, user input containing <script>alert(1)</script> could be injected into a page and execute as code — this is a Cross-Site Scripting (XSS) attack. Encoding converts < to &lt;, preventing the browser from treating it as a tag start. OWASP identifies XSS as one of the most critical web security risks. Entity encoding is the primary mitigation.
What is the difference between named and numeric HTML entities?
Named entities use a memorable name: &amp; &lt; &gt; &quot; &nbsp; &copy; &eacute; — more readable in HTML source. Numeric entities use a number: &#38; &#60; &#62; &#8217; — work for any Unicode character even if no named entity exists. Numeric hex entities (&#x26;) are also valid. Modern browsers support all formats; use named entities for readability.
When should I use &nbsp; (non-breaking space)?
&nbsp; is a space that never breaks (a line won't wrap at this space). Use it to: keep specific words together (e.g., "Dr.&nbsp;Smith"), create intentional whitespace in HTML where normal spaces are collapsed (e.g., in table cells), or for minimum spacing in some email clients. Don't use it as a paragraph spacing technique — use CSS margin/padding instead.
Do I need to encode all characters, or just the dangerous ones?
For XSS prevention, you only need to encode the 5 HTML-special characters: < > & " '. Most modern frameworks (React, Angular, Vue) auto-encode these when you use template syntax. Full encoding (converting every non-ASCII character to entities like &eacute;) is only needed for old HTML 3.2 compatibility or specific character sets. UTF-8 HTML pages can include most Unicode characters directly.
Does React / Vue / Angular automatically handle HTML encoding?
Yes! React's JSX (and other major frameworks) automatically HTML-encode all content rendered via template syntax: React JSX uses {variable}, Vue uses {{ variable }}, Angular uses {{ variable }}. All of these are safe by default. Vulnerabilities arise only when you explicitly use dangerouslySetInnerHTML (React), v-html (Vue), or [innerHTML] (Angular) without sanitization.
What is the difference between HTML encoding and URL encoding?
HTML encoding (this tool) makes text safe to place inside HTML documents — converts & to &amp;, < to &lt;. URL encoding (percent-encoding) makes text safe for URL parameters — converts & to %26, space to %20. Use HTML encoding for HTML content; use URL encoding (encodeURIComponent() in JavaScript) for URL query string values.

How This Tool Works

For encoding, each character in the input string is checked against a character-to-entity map. Characters with special meaning in HTML (< > & " ' and optionally all non-ASCII characters) are replaced with their named or numeric entity equivalent. For decoding, an off-screen div element is created in the browser's hidden DOM, the HTML entity string is set as its innerHTML, and then .textContent is read — the browser itself performs the entity decoding, ensuring 100% accuracy for all named, decimal numeric, and hex numeric entities.

Technical Stack

Browser innerHTML/textContent APICharacter-to-entity mapUnicode supportClient-side only