HTML Entity Reference Guide

HTML entities represent characters that either have special meaning in HTML or benefit from explicit encoding. You have three syntax options:

Named entity: &name; (e.g., ©)
Decimal numeric: &#number; (e.g., ©)
Hexadecimal numeric: &#xhexcode; (e.g., ©)

With UTF-8 encoding (the only sensible choice in 2026), most special characters can be typed directly. However, certain characters must always be escaped, and named entities significantly improve source code readability.

Characters That Must Always Be Escaped

These five characters have special meaning in HTML and must be escaped everywhere:

Character	Named Entity	Numeric	Purpose
`<`	`<`	`<`	Prevents tag interpretation
`>`	`>`	`>`	Prevents tag interpretation
`&`	`&`	`&`	Required before entity-like text
`"`	`"`	`"`	In double-quoted attributes
`'`	`'`	`'`	In single-quoted attributes

Escaping Examples

<!-- Text content with comparison operators -->
<p>Use &lt; and &gt; for comparisons: x &lt; 10 and y &gt; 5</p>

<!-- Ampersand before entity-like text -->
<p>Johnson &amp; Sons &mdash; Est. 1985</p>

<!-- Ampersand in URLs (attribute values) -->
<a href="search.php?q=fish&amp;chips">Search results</a>

<!-- Quotes in attributes -->
<p title="Use &quot;quotes&quot; carefully">Hover here</p>

<!-- JSON in data attributes -->
<div data-config='{"message": "&lt;error&gt;"}'></div>

The ampersand rule is critical: whenever & is followed by letters or numbers that resemble an entity pattern, escape it. Modern browsers are somewhat forgiving, but explicit escaping prevents rendering surprises.

When to Use Named vs. UTF-8 Characters

Use named entities for readability when maintaining human-readable source code matters:

<footer>
  &copy; 2026 &mdash; All rights reserved &mdash; €50/month
</footer>

<p>Price: &pound;99 &times; 12 = &pound;1,188</p>

Use direct UTF-8 characters when you’re confident about file encoding (always declare it):

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Example</title>
</head>
<body>
  <footer>
    © 2026 — All rights reserved — €50/month
  </footer>

  <p>Price: £99 × 12 = £1,188</p>
</body>
</html>

Named entities are self-documenting and work reliably across all browsers. Direct UTF-8 characters are cleaner in rendered output and easier to edit. Choose based on your workflow.

Punctuation and Typographic Entities

Description	Named Entity	Character
Left single quote	`‘`	‘
Right single quote	`’`	‘
Left double quote	`“`	“
Right double quote	`”`	“
En dash	`–`	–
Em dash	`—`	—
Ellipsis	`…`	…
Non-breaking space	` `	(space)

Use smart quotes and proper dashes in body text for professional typography:

<p>&ldquo;The quick brown fox,&rdquo; she said &mdash; perfectly phrased.</p>

<p>Price range: $50&ndash;$100 (use en dash for ranges)</p>

<p>Wait for it&hellip;</p>

Currency Symbols

Description	Named Entity	Character
Euro	`€`	€
Pound sterling	`£`	£
Yen	`¥`	¥
Cent	`¢`	¢

Mathematical Symbols

Description	Named Entity	Character
Plus or minus	`±`	±
Multiplication	`×`	×
Division	`÷`	÷
Fraction one-half	`½`	½
Fraction one-fourth	`¼`	¼
Fraction three-fourths	`¾`	¾
Superscript 1	`¹`	¹
Superscript 2	`²`	²
Superscript 3	`³`	³
Degree	`°`	°
Micro	`µ`	µ
Per mille	`&permil;`	‰
Infinity	`∞`	∞
Square root	`√`	√
Not equal	`≠`	≠
Less than or equal	`≤`	≤
Greater than or equal	`≥`	≥

Arrows

Direction	Named Entity	Character
Leftward	`←`	←
Rightward	`→`	→
Upward	`↑`	↑
Downward	`↓`	↓
Left-right	`↔`	↔

Greek Letters

Letter	Named Entity	Character
Alpha	`α`	α
Beta	`β`	β
Gamma	`γ`	γ
Delta	`δ`	δ
Epsilon	`ε`	ε
Pi	`π`	π
Sigma	`σ`	σ
Omega	`ω`	ω

Accented Characters

Uppercase

Description	Named Entity	Character
A grave	`À`	À
A acute	`Á`	Á
A circumflex	`Â`	Â
A tilde	`Ã`	Ã
A umlaut	`Ä`	Ä
C cedilla	`Ç`	Ç
E grave	`È`	È
E acute	`É`	É
N tilde	`Ñ`	Ñ
O umlaut	`Ö`	Ö
U umlaut	`Ü`	Ü

Lowercase

Description	Named Entity	Character
a grave	`à`	à
a acute	`á`	á
a circumflex	`â`	â
a tilde	`ã`	ã
a umlaut	`ä`	ä
c cedilla	`ç`	ç
e grave	`è`	è
e acute	`é`	é
n tilde	`ñ`	ñ
o umlaut	`ö`	ö
u umlaut	`ü`	ü
Sharp s (German)	`ß`	ß

Other Common Entities

Description	Named Entity	Character
Copyright	`©`	©
Registered trademark	`®`	®
Trademark	`™`	™
Section	`§`	§
Paragraph	`¶`	¶
Dagger	`&dagger;`	†
Double dagger	`&Dagger;`	‡
Bullet	`•`	•
Middle dot	`·`	·
Spade	`&spades;`	♠
Club	`&clubs;`	♣
Heart	`&hearts;`	♥
Diamond	`&diams;`	♦
Inverted !	`¡`	¡
Inverted ?	`¿`	¿

Best Practices

Always declare UTF-8 encoding. This is non-negotiable:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Example</title>
</head>
<body>
  <p>© 2026 Company — All rights reserved</p>
</body>
</html>

Escape the five critical characters everywhere. This applies in text content, attributes, data attributes, and any context where HTML is parsed:

<!-- Text content -->
<p>Use &lt; and &gt; for comparisons</p>

<!-- Attributes -->
<a href="search.php?q=fish&amp;chips">Search</a>
<input type="text" placeholder="Enter &quot;name&quot;">

<!-- Data attributes and embedded markup -->
<div data-config='{"error": "&lt;critical&gt;"}'></div>

Use named entities for improved source readability when you need to maintain the code long-term:

<footer>&copy; 2026 &mdash; All rights reserved</footer>

Be cautious with ampersands. Any ampersand followed by letters or numbers that look entity-like should be escaped:

<!-- Bad: Could be misinterpreted -->
<p>Fish & chips</p>

<!-- Good: Explicitly escaped -->
<p>Fish &amp; chips</p>

<!-- Safe: No entity-like pattern follows -->
<p>Q&A section</p>

Most modern browsers tolerate unescaped ampersands in safe contexts, but explicit escaping is the professional approach and prevents edge cases.

Replace deprecated entities with CSS. The  (soft hyphen) entity is rarely needed. Use modern CSS properties instead:

.content {
  word-break: break-word;
  hyphens: auto;
  overflow-wrap: break-word;
}

This approach provides better control over text wrapping on responsive layouts and works reliably across all devices.