HTML Entity for Clockwise Open Circle Arrow (↻)
What You'll Learn
How to display the Clockwise Open Circle Arrow (↻) in HTML using numeric references, the named entity, and CSS escapes. This character is U+21BB (CLOCKWISE OPEN CIRCLE ARROW) in the Arrows block (U+2190–U+21FF). It is widely used for refresh, reload, and rotation controls in user interfaces.
You can use the named entity ↻, hex ↻, decimal ↻, or CSS \21BB. Do not confuse ↻ with Anticlockwise Open Circle Arrow U+21BA (↺), Clockwise Gapped Circle Arrow U+27F3 (⟳), or Clockwise Closed Circle Arrow U+2941 (⥁).
⚡ Quick Reference — Clockwise Open Circle Arrow
U+21BBArrows block (U+2190–U+21FF)
↻Hexadecimal reference
↻Decimal reference
↻Standard HTML entity
Name Value
──────────── ──────────
Unicode U+21BB
Hex code ↻
HTML code ↻
Named entity ↻
CSS code \21BBComplete HTML Example
This example demonstrates the Clockwise Open Circle Arrow (↻) using hexadecimal code, decimal HTML code, the named entity ↻, and a CSS content escape:
<!DOCTYPE html>
<html>
<head>
<style>
#point:after{
content: "\21BB";
}
</style>
</head>
<body>
<p>Clockwise Open Circle Arrow using Hexa Decimal: ↻</p>
<p>Clockwise Open Circle Arrow using HTML Code: ↻</p>
<p>Clockwise Open Circle Arrow using HTML Entity: ↻</p>
<p id="point">Clockwise Open Circle Arrow using CSS Entity: </p>
</body>
</html>🌐 Browser Support
U+21BB is supported in all modern browsers:
👀 Live Preview
See the Clockwise Open Circle Arrow in UI contexts:
🧠 How It Works
Hexadecimal Code
↻ references code point U+21BB using hex digits 21BB.
Decimal HTML Code
↻ is the decimal equivalent (8635) for the same character.
Named HTML Entity
↻ is the standard named entity for U+21BB—“o” for open plus “rarr” for right arrow.
CSS Entity
\21BB is the CSS escape for U+21BB, used in the content property of ::before or ::after.
Same visual result
All four methods produce the Clockwise Open Circle Arrow glyph: ↻. Unicode U+21BB sits in Arrows (U+2190–U+21FF).
Use Cases
The Clockwise Open Circle Arrow (↻) commonly appears in:
Browser-style reload buttons and page refresh controls in toolbars.
Clockwise rotation in image editors, 3D viewers, and design tools.
Clockwise flow or circular process steps in charts and flowcharts.
Loading spinners and progress indicators suggesting rotation.
Reload or refresh actions in menus, headers, and control panels.
Unicode tables and Arrows block glossaries.
Pair with visible text or aria-label="Refresh" on icon-only controls.
💡 Best Practices
Do
- Prefer
↻for readable HTML on refresh/rotate controls - Provide visible “Reload” or “Refresh” text on icon buttons
- Use
aria-label="Refresh"on icon-only reload controls - Choose fonts that support the Arrows block (Segoe UI Symbol, Noto Sans Symbols)
- Use
\21BBonly inside CSScontent, not in HTML text nodes
Don’t
- Confuse U+21BB (↻) with U+21BA anticlockwise open (↺) or U+27F3 gapped (⟳)
- Use U+021BB notation—the correct code point is U+21BB
- Rely on the glyph alone without accessible labels on interactive buttons
- Assume every circular arrow symbol means the same thing
- Mix entity styles randomly in one file
Key Takeaways
Named entity is the easiest option
↻Numeric references also render ↻
↻ ↻For CSS stylesheets, use the escape in the content property
\21BBU+21BB CLOCKWISE OPEN CIRCLE ARROW
Four methods, one glyph — universally supported in modern browsers
❓ Frequently Asked Questions
↻ (named entity), ↻ (hex), ↻ (decimal), or \21BB in CSS content. All produce ↻.U+21BB (CLOCKWISE OPEN CIRCLE ARROW). Arrows block (U+2190–U+21FF). Hex 21BB, decimal 8635.↻, ↻, or ↻) go directly in markup. The CSS escape \21BB is used in stylesheets, typically in the content property of pseudo-elements.↻ is the named entity for U+21BB. Anticlockwise Open Circle Arrow is a different character: U+21BA (↺) with entity ↺.Explore More HTML Entities!
Discover 1500+ HTML character references — math operators, symbols, arrows, and more.
About the author
8 people found this page helpful