HTML Entity for White Nib (✑)
What You'll Learn
How to display the White Nib symbol (✑) in HTML using hexadecimal, decimal, and CSS escape methods. This character is U+2711 (WHITE NIB) in the Dingbats block (U+2700–U+27BF)—an outline fountain-pen nib icon.
Render it with ✑, ✑, or CSS escape \2711. There is no named HTML entity. Do not confuse ✑ with ✒ (black nib) or ✏ (pencil).
⚡ Quick Reference — White Nib
U+2711Dingbats
✑Hexadecimal reference
✑Decimal reference
—Use numeric codes only
Name Value
──────────── ──────────
Unicode U+2711
Hex code ✑
HTML code ✑
Named entity (none)
CSS code \2711
Meaning White nib (fountain pen tip)
Related U+2712 = ✒ (black nib)
U+270F = ✏ (pencil)
U+270E = ✎ (lower right pencil)
Block Dingbats (U+2700–U+27BF)Complete HTML Example
A simple example showing White Nib (✑) using hexadecimal code, decimal HTML code, and a CSS content escape:
<!DOCTYPE html>
<html>
<head>
<style>
#nib:after{
content: "\2711";
}
</style>
</head>
<body>
<p>White Nib (hex): ✑</p>
<p>White Nib (decimal): ✑</p>
<p id="nib">White Nib (CSS): </p>
</body>
</html>🌐 Browser Support
U+2711 is supported in modern browsers when the font includes Dingbats glyphs:
👀 Live Preview
See White Nib (✑) in context:
🧠 How It Works
Hexadecimal Code
✑ uses the Unicode hexadecimal value 2711 to display the character. The x prefix indicates hexadecimal format.
Decimal HTML Code
✑ uses the decimal Unicode value 10001 to display the same character. A common method for symbol characters in HTML.
CSS Entity
\2711 is used in CSS stylesheets, particularly in the content property of pseudo-elements like ::before and ::after.
Same visual result
All three methods produce the glyph: ✑. Unicode U+2711 is the white nib in Dingbats. Not the same as ✒ (black nib) or ✏ (pencil).
Use Cases
White Nib (✑) is commonly used in:
Text editors, CMS tools, and compose/write buttons.
Stationery sites, pen products, and luxury writing brands.
Logos, portfolios, and content about authorship or craft.
Handwriting guides, calligraphy tutorials, and artistic writing.
Office supply stores and writing-tool e-commerce pages.
Blog headers, journalism sections, and writer-focused content.
Pair ✑ with visible text like “Write” or aria-label; do not rely on the glyph alone.
💡 Best Practices
Do
- Use ✑ for an outline nib; use ✒ for the filled black nib variant
- Pair the nib glyph with accessible text like “Write” or
aria-label - Pick one numeric style (hex or decimal) per project for consistency
- Use fonts that support Dingbats characters
- Test rendering across browsers and devices
Don’t
- Confuse ✑ (white nib) with ✒ (black nib) or ✏ (pencil)
- Use the nib glyph as the only cue for critical edit/write actions
- Mix entity styles randomly in one file
- Use CSS escape
\2711inside HTML markup - Expect a named HTML entity—none exists for ✑
Key Takeaways
Type ✑ directly, or use hex/decimal references
✑ ✑For CSS stylesheets, use the escape in the content property
\2711Unicode U+2711 — WHITE NIB (Dingbats)
U+2711/U+2712 are white/black nib pairs in Dingbats
Previous: White Left Pointing Index (☜) Next: White Right Pointing Index (☞)
❓ Frequently Asked Questions
✑ (hex), ✑ (decimal), or \2711 in CSS content. There is no named HTML entity. In UTF-8 you can also type ✑ directly.U+2711 (WHITE NIB). Dingbats block U+2700–U+27BF. Hex 2711, decimal 10001.✑ or ✑) go directly in markup. The CSS escape \2711 is used in stylesheets, typically in the content property of ::before or ::after. Same visual result, different layers of the stack.✑ or ✑ in HTML, or \2711 in CSS.Explore More HTML Entities!
Discover 1500+ HTML character references — symbols, punctuation, and more.
About the author
8 people found this page helpful