HTML Entity for Horizontal Bar (―)
What You'll Learn
How to display the Horizontal Bar (―) in HTML using hexadecimal, decimal, named entity, and CSS escape methods. This character is U+2015 (HORIZONTAL BAR) in the General Punctuation block (U+2000–U+206F).
Render it with ―, ―, ―, or CSS escape \2015. Use it for text breaks, separators, and typography in web design. It has a named HTML entity (―) for readable markup.
⚡ Quick Reference — Horizontal Bar
U+2015General Punctuation
―Hexadecimal reference
―Decimal reference
―Most readable option
Name Value
──────────── ──────────
Unicode U+2015
Hex code ―
HTML code ―
Named entity ―
CSS code \2015
Meaning Horizontal bar (long dash)
CSS note \2015 or \02015 in content propertyComplete HTML Example
This example demonstrates the Horizontal Bar symbol (―) using hexadecimal code, decimal HTML code, the named entity, and a CSS content escape:
<!DOCTYPE html>
<html>
<head>
<style>
#point:after{
content: "\2015";
}
</style>
</head>
<body>
<p>Horizontal Bar using Hexadecimal: ―</p>
<p>Horizontal Bar using Decimal: ―</p>
<p>Horizontal Bar using Named Entity: ―</p>
<p id="point">Horizontal Bar using CSS Entity: </p>
</body>
</html>🌐 Browser Support
The Horizontal Bar (―) is supported in all modern browsers; most fonts include General Punctuation:
👀 Live Preview
See the Horizontal Bar (―) in typography and separator contexts:
🧠 How It Works
Hexadecimal Code
― uses the Unicode hexadecimal value 2015 to display the symbol. The x prefix indicates hexadecimal format.
Decimal HTML Code
― uses the decimal Unicode value 8213 to display the same character.
Named Entity
― is the semantic named entity for ―—readable in source HTML and part of the HTML5 character set.
CSS Entity
\2015 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+2015 is in General Punctuation. Next: Horizontal Ellipsis.
Use Cases
The Horizontal Bar symbol (―) is commonly used in:
Visual breaks between sections, paragraphs, or list items.
Article dividers, pull quotes, bylines, and editorial typography.
Separate content blocks or simple horizontal rules in page design.
Stylistic dashes in titles, captions, or headings.
Horizontal bars between menu items or list groups.
Logos, headers, and minimal design accents.
💡 Best Practices
Do
- Use
―for readable source markup - Most fonts support General Punctuation (U+2015); test on target devices
- Keep one method (named, hex, or decimal) consistent across the document
- For thematic breaks, consider
<hr>styled with CSS; use ― for inline dashes - Serve pages with UTF-8 (
<meta charset="utf-8">)
Don’t
- Put CSS escape
\2015in HTML text nodes - Confuse ― with em dash
—(U+2014) without checking typography needs - Use decorative bars without
aria-hidden="true"when appropriate for screen readers - Rely on the symbol alone for screen reader users
- Skip browser testing for math-heavy pages
Key Takeaways
Three HTML references plus CSS all render ―
― ― ―For CSS stylesheets, use the escape in the content property
\2015Unicode U+2015 — HORIZONTAL BAR
Prefer ― for readability in HTML source
Next: Horizontal Ellipsis
❓ Frequently Asked Questions
― (hex), ― (decimal), ― (named), or \2015 in CSS content. All produce ―.U+2015 (HORIZONTAL BAR). General Punctuation block (U+2000–U+206F). Hex 2015, decimal 8213. Named entity: ―.― is the named HTML entity for ―. It is part of the HTML5 named character set and the most readable option in source markup.― is used directly in HTML content. The CSS escape \2015 (or \02015) belongs in stylesheets, typically in the content property of ::before or ::after. Both render ―.― or ― for the horizontal bar and — or — for the em dash.Explore More HTML Entities!
Discover 1500+ HTML character references — punctuation, dashes, symbols, and more.
About the author
8 people found this page helpful