HTML Entity for Diamond Operator (⋄)
What You'll Learn
How to display the diamond operator (⋄) in HTML using named, hexadecimal, decimal, and CSS entity methods. This symbol is U+22C4 (DIAMOND OPERATOR) in the Mathematical Operators block (U+2200–U+22FF), used in logic, set theory, number theory, and programming notation.
You can render it with the named entity ⋄, hexadecimal ⋄, decimal ⋄, or CSS escape \22C4. Do not confuse with geometric diamonds ◆ (U+25C6) or ◇ (U+25C7). See also XOR (⊻) for another math operator.
⚡ Quick Reference — Diamond Operator
U+22C4Mathematical Operators block
⋄Hexadecimal reference
⋄Decimal reference
⋄Most readable in HTML source
Name Value
──────────── ──────────
Unicode U+22C4
Hex code ⋄
HTML code ⋄
Named entity ⋄
CSS code \22C4Complete HTML Example
This example demonstrates the diamond operator (⋄) using hexadecimal code, decimal HTML code, the named entity, and a CSS content escape:
<!DOCTYPE html>
<html>
<head>
<style>
#point:after{
content: "\22C4";
}
</style>
</head>
<body>
<p>Diamond Operator using Hexadecimal: ⋄</p>
<p>Diamond Operator using HTML Code: ⋄</p>
<p>Diamond Operator using HTML Entity: ⋄</p>
<p id="point">Diamond Operator using CSS Entity: </p>
</body>
</html>🌐 Browser Support
The diamond operator entity is supported in all modern browsers; use a font with Mathematical Operators coverage for best display:
👀 Live Preview
See the diamond operator (⋄) in mathematical and logical contexts:
🧠 How It Works
Named HTML Entity
⋄ is the semantic named entity for the diamond operator—the easiest to read in source HTML.
Hexadecimal Code
⋄ uses the Unicode hexadecimal value 22C4. The x prefix indicates hexadecimal format.
Decimal HTML Code
⋄ uses the decimal Unicode value 8900 to display the same character.
CSS Entity
\22C4 is used in CSS stylesheets, particularly in the content property of ::before and ::after.
Same visual result
All four methods produce the diamond operator: ⋄. Unicode U+22C4 is in Mathematical Operators (U+2200–U+22FF).
Use Cases
The diamond operator (⋄) is commonly used in:
Diamond operators in modular forms and related number-theory notation.
Modal or formal operators (e.g. diamond for “possibility” alongside box □).
Notation for operations or relations in set theory, lattices, and abstract algebra.
Technical documentation describing algorithms or formal notation.
Math tutorials, logic courses, and textbooks with diamond symbols.
Unicode tables and HTML entity guides for math operators.
💡 Best Practices
Do
- Use
⋄for readable math-heavy markup - Choose math-friendly fonts (Cambria Math, STIX Two Math)
- Add context or
aria-labelwhen meaning is non-obvious - Use
\22C4only inside CSScontent - Pick one entity style per project
Don’t
- Confuse ⋄ (operator U+22C4) with ◆ (U+25C6) or ◇ (U+25C7)
- Use geometric diamond codes for mathematical operator notation
- Rely on fonts that omit Mathematical Operators
- Put CSS escape
\22C4in HTML text nodes - Mix entity styles randomly in one file
Key Takeaways
Four ways to render ⋄ in HTML
⋄ ⋄ ⋄For CSS stylesheets, use the escape in the content property
\22C4U+22C4 DIAMOND OPERATOR—not a shape glyph
Prefer ⋄ for readability in HTML source
Mathematical Operators block—widely supported in modern browsers
❓ Frequently Asked Questions
⋄ (named), ⋄ (hex), ⋄ (decimal), or \22C4 in CSS content. All produce ⋄.U+22C4 (DIAMOND OPERATOR). Mathematical Operators block (U+2200–U+22FF). Hex 22C4, decimal 8900.⋄ is easier to read and remember in HTML. Numeric codes (⋄ or ⋄) work in all contexts including when named entities are escaped. CSS \22C4 is for stylesheets. Same character ⋄.⋄ or ⋄ for the operator.Explore More HTML Entities!
Discover 1500+ HTML character references — math operators, logic symbols, and more.
About the author
8 people found this page helpful