HTML Entity for Em Dash (—)
What You'll Learn
How to display the Em Dash (—) in HTML using hexadecimal, decimal, named entity, and CSS escape methods. This character is U+2014 (EM DASH) in the General Punctuation block (U+2000–U+206F)—a long dash used to separate clauses, create a break in thought, or replace parentheses.
Render it with —, —, the named entity —, or CSS escape \2014. Do not confuse the em dash with the en dash (–, U+2013, –), hyphen-minus (-), or minus sign (−, U+2212).
⚡ Quick Reference — Em Dash
U+2014General Punctuation
—Hexadecimal reference
—Decimal reference
—Most common in HTML
Name Value
──────────── ──────────
Unicode U+2014
Hex code —
HTML code —
Named entity —
CSS code \2014
Related U+2013 = En dash (– –); U+002D = Hyphen-minus (-)Complete HTML Example
This example demonstrates the Em Dash (—) using hexadecimal code, decimal HTML code, the named entity, and a CSS content escape:
<!DOCTYPE html>
<html>
<head>
<style>
#point:after{
content: "\2014";
}
</style>
</head>
<body>
<p>Em Dash using Hexadecimal: —</p>
<p>Em Dash using HTML Code: —</p>
<p>Em Dash using HTML Entity: —</p>
<p id="point">Em Dash using CSS Entity: </p>
</body>
</html>🌐 Browser Support
The Em Dash entity is universally supported in modern browsers:
👀 Live Preview
See the em dash (—) compared with the en dash (–) and a hyphen-minus (-):
— — vs – –🧠 How It Works
Hexadecimal Code
— uses the Unicode hexadecimal value 2014 to display the em dash. The x prefix indicates hexadecimal format.
Decimal HTML Code
— uses the decimal Unicode value 8212 to display the same character.
Named Entity
— is the standard named entity for U+2014. It is readable and easy to remember for punctuation in HTML.
CSS Entity
\2014 is used in CSS stylesheets, particularly in the content property of pseudo-elements like ::before and ::after.
Same visual result
All four methods produce the em dash: —. Unicode U+2014 in the General Punctuation block (U+2000–U+206F).
Use Cases
The Em Dash (—) commonly appears in:
Separate related clauses with more emphasis than a comma.
Editorial articles and posts with clear, stylish punctuation.
Technical guides and tutorials for readable typography.
Replace parentheses when an aside should stand out.
Introduce a list or summary after a clause, like a colon with more pause.
Landing pages and marketing text with professional tone.
💡 Best Practices
Do
- Prefer
—for readable HTML punctuation - Use UTF-8 (
<meta charset="utf-8">) on every page - Pick one spacing style (no spaces vs thin spaces) and stay consistent
- Use the correct dash: em, en, or hyphen for each purpose
- Test rendering with your site’s body font
Don’t
- Replace every comma or colon with an em dash
- Confuse — (em) with – (en) or - (hyphen)
- Use two hyphens (--) when an em dash is intended
- Put CSS escape
\2014in HTML text nodes - Overuse em dashes in dense technical prose
Key Takeaways
Three HTML references plus CSS all render —
— — —For CSS stylesheets, use the escape in the content property
\2014Unicode U+2014 — General Punctuation em dash
— is the standard named entity for writers
En dash is – (–, U+2013), shorter than em
❓ Frequently Asked Questions
— (hex), — (decimal), — (named), or \2014 in CSS content. All produce —.U+2014 (EM DASH). General Punctuation block (U+2000–U+206F). Hex 2014, decimal 8212.—) is longer and often used for breaks in sentences. The en dash (–, U+2013, –) is shorter and often used for ranges (e.g. pages 10–20).—, —, or —) go directly in markup. The CSS escape \2014 is used in stylesheets, typically in the content property of pseudo-elements. Same visual result, different layers of the stack.Explore More HTML Entities!
Discover 1500+ HTML character references — punctuation, math symbols, and more.
About the author
8 people found this page helpful