HTML Encoder / Decoder
Encode special characters to HTML entities (< > & ") or decode entities back. Prevent XSS, display code in HTML.
What is HTML Encoding?
HTML encoding (also called HTML escaping) converts characters that have special meaning in HTML into their entity equivalents so they display as text instead of being interpreted as code. The browser sees <script> and tries to execute it; with HTML encoding, <script> displays as literal text. Critical for: preventing XSS (Cross-Site Scripting) attacks, displaying code examples in articles, handling user-generated content safely, processing HTML in JSON APIs, escaping special characters in URLs (separate from URL encoding), creating CMS templates that handle arbitrary text. This tool handles both directions: encode plain text to HTML-safe entities, or decode entities back to original text.
How to use this tool
- Choose mode — Encode (text → entities) or Decode (entities → text).
- Enter your text — Any text including special characters: < > & " '
- View result instantly — Output updates as you type.
- Copy result — Use in HTML, JSON, configuration files.
Character mappings
The five reserved HTML characters and their entities:
| Char | Entity | Why? |
|---|---|---|
| & | & | Ampersand starts entities, must encode first |
| < | < | Opens HTML tags, would start parsing |
| > | > | Closes HTML tags |
| " | " | Would close attribute values |
| ' | ' or ' | Would close single-quoted attributes |
Optional entities (for non-ASCII):
- © → © (copyright)
- ™ → ™
- € → €
- → (non-breaking space)
Examples
- Display script tag in article:
<script>→<script>— shows as text, not executes - User comment with HTML chars: "Use < symbol" → "Use < symbol"
- JSON output with HTML: Encoded entities safely embedded in JSON strings
- XSS attempt blocked: User input
<script>alert('XSS')</script>— encoded becomes harmless text - Email template:
<a href="...">in code snippets within tutorial emails - Copyright notice: © 2024 → © 2024 for portability
Tips & best practices
- Always encode user input before displaying as HTML — critical XSS prevention
- Backend frameworks (Laravel, Django, Express) have built-in encoding helpers — use them, don't roll your own
- Don't double-encode — if already encoded, decode first, then re-encode if needed
- URL encoding (%20 for space) is DIFFERENT from HTML encoding — don't confuse them
- Don't HTML-encode JavaScript variables — they need separate JS escaping
- For code snippets in tutorials: encode display content, but show original to reader as code blocks
- WordPress strips most HTML by default — check if your CMS is already encoding
Limitations & notes
Only handles the 5 reserved HTML characters in encode mode. For comprehensive encoding (extended entities like ©, ™, special non-ASCII), use library functions. Decoding uses browser's built-in HTML parser — handles most entities but may not catch obscure ones. For security-critical encoding, use dedicated security libraries (DOMPurify, OWASP encoders).
Frequently Asked Questions
Why is encoding important?
Prevents XSS attacks. If user input is rendered as HTML without encoding, attackers can inject scripts that steal cookies, hijack sessions, or deface your site. Encoding makes user input safe to display.
Is HTML encoding the same as URL encoding?
No — different things. URL encoding (%20 for space, %3F for ?) makes strings safe for URLs. HTML encoding makes strings safe for HTML documents. Both convert special chars but to different formats.
Should I encode every character?
Only the 5 reserved chars (& < > " '). Other characters display fine. Over-encoding (encoding letters/numbers/safe symbols) wastes bytes and makes output ugly.
What if my text is already encoded?
Decode it first using this tool's decode mode. Then re-encode if needed. Double-encoding (encoding already-encoded text) breaks rendering.
How does browser DevTools display HTML entities?
Source view (Ctrl+U) shows raw HTML with entities (<). DevTools Inspector shows rendered DOM with decoded characters. Both are correct — different views.
What's the difference between ' and '?
Both produce apostrophe. ' was added in HTML 5; ' (numeric entity) works in all HTML versions including older XHTML. Both are valid; numeric is more compatible.
Why does some content show as garbage after decoding?
Likely encoded with different scheme (URL encoding, base64) not HTML encoding. Try different decoders. Or content was incorrectly encoded originally.
Related tools
URL Encoder & Decoder · Base64 Encoder & Decoder · Code Minifier
