HTML Entity for Hyphen (‐)
What You'll Learn
How to display the Hyphen (‐) in HTML using hexadecimal, decimal, named entity, and CSS escape methods. This character is U+2010 (HYPHEN) in the General Punctuation block (U+2000–U+206F). It is the proper Unicode hyphen for compound words and explicit hyphenation.
Render it with ‐, ‐, ‐, or CSS escape \2010. Prefer ‐ when you need a semantic hyphen rather than the ASCII hyphen-minus (-, U+002D).
⚡ Quick Reference — Hyphen
U+2010General Punctuation
‐Hexadecimal reference
‐Decimal reference
‐‐ — readable option
Name Value
──────────── ──────────
Unicode U+2010
Hex code ‐
HTML code ‐
Named entity ‐
CSS code \2010
Meaning Unicode hyphen (compound words)
CSS note \2010 or \02010 in content propertyComplete HTML Example
This example demonstrates the Hyphen symbol (‐) using hexadecimal code, decimal HTML code, the named entity, and a CSS content escape:
<!DOCTYPE html>
<html>
<head>
<style>
#point:after{
content: "\2010";
}
</style>
</head>
<body>
<p>Hyphen using Hexadecimal: ‐</p>
<p>Hyphen using Decimal: ‐</p>
<p>Hyphen using Named Entity: ‐</p>
<p id="point">Hyphen using CSS Entity: </p>
</body>
</html>🌐 Browser Support
The Hyphen (‐) is supported in all modern browsers; most fonts include General Punctuation (U+2010):
👀 Live Preview
See the Hyphen (‐) in compound words and typography:
🧠 How It Works
Hexadecimal Code
‐ uses the Unicode hexadecimal value 2010 to display the symbol. The x prefix indicates hexadecimal format.
Decimal HTML Code
‐ uses the decimal Unicode value 8208 to display the same character.
Named Entity
‐ is the named entity for ‐—easy to remember and clear in source HTML.
CSS Entity
\2010 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 glyph: ‐. Unicode U+2010 is in General Punctuation. Next: Hyphen Bullet.
Use Cases
The Hyphen symbol (‐) is commonly used in:
Join words in compound terms (e.g. well‐known, user‐friendly).
Indicate allowed break points; browsers can use the Unicode hyphen for hyphenation.
Published content and documents where the correct hyphen character matters.
Hyphenated slugs or identifiers where a true hyphen is required.
Date or number ranges (e.g. 2020‐2025) with the Unicode hyphen.
Consistent hyphen character across fonts and platforms.
💡 Best Practices
Do
- Use
‐for readable, semantic source markup - Use ‐ (U+2010) for hyphenation and compound words
- Keep one method (named, hex, or decimal) consistent across the document
- Use
­only for optional line-break hyphens (invisible until break) - Serve pages with UTF-8 (
<meta charset="utf-8">)
Don’t
- Put CSS escape
\2010in HTML text nodes - Confuse hyphen (‐) with en dash (–) or em dash (—)
- Use
‐when­(soft hyphen) is what you need - Assume the keyboard hyphen (-) is always the same as U+2010
- Skip font testing for pages heavy in Latin Extended punctuation
Key Takeaways
Three HTML references plus CSS all render ‐
‐ ‐ ‐For CSS stylesheets, use the escape in the content property
\2010Unicode U+2010 — HYPHEN
Prefer ‐ for readability in HTML source
Next: Hyphen Bullet
❓ Frequently Asked Questions
‐ (hex), ‐ (decimal), ‐ (named), or \2010 in CSS content. All produce ‐.U+2010 (HYPHEN). General Punctuation block (U+2000–U+206F). Hex 2010, decimal 8208. Named entity: ‐. Distinct from hyphen-minus (-, U+002D).‐ (U+2010) is the Unicode hyphen for compound words and hyphenation. The keyboard hyphen (-) is hyphen-minus (U+002D). For semantic hyphenation, prefer ‐ or ‐.‐ produces a visible hyphen (‐). ­ is the soft hyphen: normally invisible and only appears when the browser breaks the line. Use ‐ when the hyphen should always show.‐ is used directly in HTML content. The CSS escape \2010 belongs in stylesheets, typically in the content property of pseudo-elements. Both render ‐.Explore More HTML Entities!
Discover 1500+ HTML character references — punctuation, dashes, symbols, and more.
About the author
8 people found this page helpful