HTML Entity for Long Left Arrow (⟵)
What You'll Learn
How to display the Long Left Arrow (⟵) symbol in HTML using hexadecimal, decimal, named entity, and CSS escape methods. This character is U+27F5 (LONG LEFTWARDS ARROW) in the Supplemental Arrows-C block.
Render it with ⟵, ⟵, ⟵, or CSS escape \27F5. It is used for direction, navigation, flow in diagrams, and mathematical notation. For the standard short arrow, see Left Arrow (←, ←).
⚡ Quick Reference — Long Left Arrow
U+27F5Supplemental Arrows-C
⟵Hexadecimal reference
⟵Decimal reference
⟵Most readable option
Name Value
──────────── ──────────
Unicode U+27F5
Hex code ⟵
HTML code ⟵
Named entity ⟵
CSS code \27F5
Meaning Long leftwards arrow
Related U+2190 = ← (←)
Block Supplemental Arrows-CComplete HTML Example
A simple example showing the Long Left Arrow (⟵) using hexadecimal code, decimal HTML code, the named entity, and a CSS content escape:
<!DOCTYPE html>
<html>
<head>
<style>
#point:after{
content: "\27F5";
}
</style>
</head>
<body>
<p>Symbol (hex): ⟵</p>
<p>Symbol (decimal): ⟵</p>
<p>Symbol (named): ⟵</p>
<p id="point">Symbol (CSS): </p>
</body>
</html>🌐 Browser Support
The Long Left Arrow (⟵) is supported in modern browsers when the font includes Supplemental Arrows glyphs:
👀 Live Preview
See the Long Left Arrow (⟵) in navigation and diagram contexts:
🧠 How It Works
Hexadecimal Code
⟵ uses the Unicode hexadecimal value 27F5 to display the arrow.
Decimal HTML Code
⟵ uses the decimal Unicode value 10229 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
\27F5 is used in CSS stylesheets, particularly in the content property of pseudo-elements.
Same visual result
All four methods produce the glyph: ⟵. Unicode U+27F5 is in Supplemental Arrows-C. Previous: Logical OR.
Use Cases
The Long Left Arrow (⟵) is commonly used in:
Back links, breadcrumbs, and directional UI labels.
Process diagrams showing flow from right to left.
Limits, mappings, and long-arrow relations in equations.
Step-by-step guides and state transition descriptions.
Pagination, carousel controls, and direction indicators.
Slides and notes that need a clear left-pointing arrow.
💡 Best Practices
Do
- Use
⟵for readable source markup - Pair arrows with text labels for accessibility (e.g. “Back”)
- Choose ⟵ when you need a longer stroke than ←
- Use fonts that support arrow symbols for consistent rendering
- Serve pages with UTF-8 (
<meta charset="utf-8">)
Don’t
- Confuse
⟵(⟵) with←(←) when precision matters - Put CSS escape
\27F5in HTML text nodes - Rely on the arrow glyph alone for screen reader users
- Assume every font renders long arrows identically—test on mobile
- Use arrows as the only navigation affordance without focus styles
Key Takeaways
Four HTML/CSS references all render ⟵
⟵ ⟵ ⟵For CSS stylesheets, use the escape in the content property
\27F5Unicode U+27F5 — LONG LEFTWARDS ARROW
Prefer ⟵ for readability; short arrow is ←
Previous: Logical OR Next: Long Left Arrow Bar
❓ Frequently Asked Questions
⟵ (hex), ⟵ (decimal), ⟵ (named), or \27F5 in CSS content. All produce ⟵.U+27F5 (LONG LEFTWARDS ARROW). Supplemental Arrows-C block. Hex 27F5, decimal 10229. 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 the standard leftwards arrow. ⟵ (⟵) is the long leftwards arrow with a longer horizontal stroke.Explore More HTML Entities!
Discover 1500+ HTML character references — arrows, symbols, and more.
About the author
8 people found this page helpful