HTML Entity for Left Right Arrow (↔)
What You'll Learn
How to display the Left Right Arrow (↔) in HTML using the named entity, hexadecimal, decimal, and CSS escape methods. This symbol is U+2194 (LEFT RIGHT ARROW) in the Arrows block (U+2190–U+21FF)—a bidirectional horizontal arrow used in navigation, diagrams, equivalence notation, and UI controls.
Render it with ↔ (named), ↔, ↔, or CSS \2194. Related: U+2190 (←, left arrow / ←), U+2192 (→, right arrow / →).
⚡ Quick Reference — Left Right Arrow
U+2194Arrows block
↔Hexadecimal reference
↔Decimal reference
↔Most readable option
Name Value
──────────── ──────────
Unicode U+2194
Hex code ↔
HTML code ↔
Named entity ↔
CSS code \2194
Meaning Left right arrow (bidirectional)
Related U+2190 = left arrow (←)
U+2192 = right arrow (→)Complete HTML Example
A simple example showing the Left Right Arrow (↔) using the named entity, hexadecimal code, decimal HTML code, and a CSS content escape:
<!DOCTYPE html>
<html>
<head>
<style>
#point:after{
content: "\2194";
}
</style>
</head>
<body>
<p>Symbol using Hexadecimal: ↔</p>
<p>Symbol using HTML Code: ↔</p>
<p>Symbol using HTML Entity: ↔</p>
<p id="point">Symbol using CSS Entity: </p>
</body>
</html>🌐 Browser Support
The Left Right Arrow (↔) renders in modern browsers when the font includes Arrows block glyphs:
👀 Live Preview
See the Left Right Arrow (↔) in navigation and diagram contexts:
🧠 How It Works
Named HTML Entity
↔ is the named entity for the Left Right Arrow (bidirectional horizontal arrow). Easy to read in navigation and diagram markup.
Hexadecimal Code
↔ uses the Unicode hexadecimal value 2194. The x prefix indicates hexadecimal format.
Decimal HTML Code
↔ uses the decimal Unicode value 8596 for the same symbol.
CSS Entity
\2194 is used in CSS stylesheets in the content property of pseudo-elements like ::after.
Same visual result
All four methods produce ↔. Unicode U+2194 is in the Arrows block. Previous: Left Parenthesis.
Use Cases
The Left Right Arrow (↔) is commonly used in:
Bidirectional links, swap controls, and two-way navigation in web interfaces.
Show two-way flow or reversible relationships in process diagrams.
Equivalence, bidirectional mappings, and horizontal arrows in technical writing.
Illustrate bidirectional arrow symbols in guides and reference material.
Resize handles, swap buttons, and horizontal direction indicators.
Document and teach HTML entity usage for Arrows block symbols.
💡 Best Practices
Do
- Prefer
↔in HTML for readability - Use fonts that support the Arrows block (U+2194)
- Set
<meta charset="utf-8"> - Pair ↔ with context (navigation, diagrams) so meaning is clear
- Keep one encoding style per project for consistency
- Distinguish ↔ from ← and → when bidirectional vs single direction matters
Don’t
- Confuse
↔(U+2194, left right) with⇆(U+21C6, left arrow over right) - Confuse
↔(U+2194) with⇔(U+21D4, double arrow) - Use CSS
\2194inside HTML text nodes - Assume all fonts render arrow glyphs identically
- Mix named and numeric entities inconsistently in the same component
Key Takeaways
Four ways to render U+2194 in HTML and CSS
↔ ↔ ↔For CSS, use \2194 in the content property
Unicode U+2194 — LEFT RIGHT ARROW
Arrows block (U+2190–U+21FF) — named entity ↔
Previous: Left Parenthesis (() Next: Left Right Arrow Below
❓ Frequently Asked Questions
↔ (named), ↔ (hex), ↔ (decimal), or \2194 in CSS content. All four methods render ↔ correctly.U+2194 (LEFT RIGHT ARROW). Arrows block (U+2190–U+21FF). Hex 2194, decimal 8596. A bidirectional horizontal arrow pointing left and right.↔, ↔, ↔) go in markup. The CSS escape \2194 is used in stylesheets, typically on ::before or ::after. Both produce ↔.↔ is the named HTML entity for U+2194. You can also use ↔ (decimal) or ↔ (hex) and \2194 in CSS.Explore More HTML Entities!
Discover 1500+ HTML character references — arrows, symbols, math operators, and more.
About the author
8 people found this page helpful