HTML Entity for Down Arrow From Bar (↧)
What You'll Learn
How to display the Down Arrow From Bar (↧) in HTML using hexadecimal, decimal, and CSS escape methods. This character is U+21A7 (DOWNWARDS ARROW FROM BAR) in the Arrows block (U+2190–U+21FF)—a downward arrow starting from a horizontal bar, used in flowcharts, math notation, and technical diagrams.
Render it with ↧, ↧, or CSS escape \21A7. There is no named HTML entity for this symbol, so numeric references are required. For a straight down arrow use ↓ (↓); for Enter/Return notation use ↵ (↵).
⚡ Quick Reference — Down Arrow From Bar
U+21A7Arrows block
↧Hexadecimal reference
↧Decimal reference
—Use numeric codes only
Name Value
──────────── ──────────
Unicode U+21A7
Hex code ↧
HTML code ↧
Named entity (none)
CSS code \21A7
Related U+2193 = Down arrow (↓); U+21B5 = Corner left (↵)Complete HTML Example
This example demonstrates the Down Arrow From Bar (↧) using hexadecimal code, decimal HTML code, and a CSS content escape:
<!DOCTYPE html>
<html>
<head>
<style>
#point:after{
content: "\21A7";
}
</style>
</head>
<body>
<p>Down Arrow From Bar using Hexadecimal: ↧</p>
<p>Down Arrow From Bar using HTML Code: ↧</p>
<p id="point">Down Arrow From Bar using CSS Entity: </p>
</body>
</html>🌐 Browser Support
U+21A7 is widely supported in modern browsers when rendered with a font that includes Arrows:
👀 Live Preview
See the Down Arrow From Bar (↧) in diagram and notation contexts:
🧠 How It Works
Hexadecimal Code
↧ uses the Unicode hexadecimal value 21A7 to display the Down Arrow From Bar. The x prefix indicates hexadecimal format.
Decimal HTML Code
↧ uses the decimal Unicode value 8615 to display the same character.
CSS Entity
\21A7 is used in CSS stylesheets, particularly in the content property of pseudo-elements like ::before and ::after.
Same visual result
All three methods produce: ↧. Unicode U+21A7. No named HTML entity—use numeric codes in markup.
Use Cases
The Down Arrow From Bar (↧) is commonly used in:
Show flow from a bar or header downward in process diagrams.
Formal proofs or notation where “down from bar” has meaning.
State machines, diagrams, and specs that use this arrow.
Content expanding downward from a header or toolbar in mockups.
Represent “open downward from bar” in design documentation.
Teach arrow symbols and diagramming in courses and tutorials.
💡 Best Practices
Do
- Use
↧or↧consistently in markup - Add
aria-labelwhen the symbol means expand down or flow from bar - Pair ↧ with a short label when meaning may not be obvious
- Use
\21A7in CSS::before/::afterfor pure-CSS icons - Serve pages with UTF-8 (
<meta charset="utf-8">)
Don’t
- Expect a named entity—none exists for U+21A7
- Confuse ↧ (from bar) with ↓ (
↓, straight down) - Put CSS escape
\21A7in HTML text nodes - Rely on the symbol alone in accessibility-critical UIs
- Assume decorative fonts include all Arrows glyphs
Key Takeaways
Two HTML numeric references render ↧
↧ ↧For CSS stylesheets, use the escape in the content property
\21A7Unicode U+21A7 — DOWNWARDS ARROW FROM BAR
No named HTML entity—numeric codes only
Three methods, one glyph — widely supported in modern browsers
❓ Frequently Asked Questions
↧ (hex), ↧ (decimal), or \21A7 in CSS content. There is no named entity. All produce ↧.U+21A7 (DOWNWARDS ARROW FROM BAR). Arrows block (U+2190–U+21FF). Hex 21A7, decimal 8615. The glyph shows a downward arrow from a horizontal bar.↧ or ↧) go in markup. The CSS escape \21A7 is used in stylesheets, typically in the content property of pseudo-elements. Same visual result, different layers of the stack.↧ or ↧ in HTML.Explore More HTML Entities!
Discover 1500+ HTML character references — arrows, symbols, math operators, and more.
About the author
8 people found this page helpful