HTML Entity for At Symbol (@)
What You'll Learn
How to display the commercial at sign (@, Unicode U+0040) in HTML. It sits in Basic Latin (ASCII) and is required for email addresses (user@example.com), social mentions (@handle), and many programming notations (decorators, annotations, and more).
You can write a literal @ in UTF-8 HTML in most cases, or use @, @, @, or \0040 / \40 in CSS content when you need an explicit escape (for example inside some template languages where @ is special).
⚡ Quick Reference — At Symbol
U+0040Basic Latin (ASCII)
@Hexadecimal reference
@Decimal reference
@HTML5 named reference
\0040Also \40 (shorter escape)
Name Value
──────────── ──────────
Unicode U+0040
Hex code @
HTML code @
Named entity @
CSS code \0040 (or \40)Complete HTML Example
This example shows U+0040 using hexadecimal, decimal, the commat named reference, and a CSS content escape:
<!DOCTYPE html>
<html>
<head>
<style>
#point:after{
content: "\0040";
}
</style>
</head>
<body>
<p>At Symbol using Hexa Decimal: @</p>
<p>At Symbol using HTML Code: @</p>
<p>At Symbol using HTML Entity: @</p>
<p id="point">At Symbol using CSS Entity: </p>
</body>
</html>The named entity is written as @ so it displays as copyable @ in this listing without being parsed by the surrounding page.
🌐 Browser Support
The commat named reference and numeric forms for U+0040 are supported everywhere ASCII is supported:
👀 Live Preview
Common patterns (always validate mailto: links and user-generated handles on the server):
🧠 How It Works
Named entity
@ (ampersand + commat + semicolon) is the HTML5 named character reference for U+0040.
Hexadecimal code
@ uses the Unicode hexadecimal value 40 (one byte in ASCII).
Decimal HTML code
@ is the classic ASCII decimal code for the at sign.
CSS escape
\0040 or \40 in content emits U+0040 from a stylesheet.
Same visual result
All paths expose U+0040 — COMMERCIAL AT. A plain @ in UTF-8 source is usually the simplest choice.
Use Cases
The at sign is everywhere in modern text and code:
Contact pages, footers, and mailto: links (user@domain when you need entities in markup).
Handles and attribution lines on blogs and community sites.
Decorators, annotations, and shell prompts shown in HTML examples.
Placeholders and hints for email fields (name@company.com).
When @ triggers framework syntax, @ can output a literal sign.
Use visible labels like “Email” so the @ is not the only cue.
Same code point and meaning across Latin-based locales.
💡 Best Practices
Do
- Use a literal
@in UTF-8 HTML when no framework conflict exists - Switch to
@when your toolchain treats@as syntax - Keep
mailto:hrefs RFC-safe and validate addresses server-side - Use
\0040or\40only inside CSScontentstrings - Sanitize user-supplied handles and emails before echoing them into HTML
Don’t
- Obfuscate email with broken patterns that harm accessibility unless you also offer a plain contact path
- Assume
@insidemailto:attributes without testing (prefer literal@in the URI) - Double-encode entities inside generated JSON or URLs
- Use CSS escapes inside raw HTML text nodes
Key Takeaways
Named + numeric ways to write U+0040
@ @ @CSS content escape
\0040Unicode U+0040 — COMMERCIAL AT
ASCII / Basic Latin — universal font coverage
Literal @ is usually enough; entities help when escaping matters
❓ Frequently Asked Questions
@ (named), @ (hex), @ (decimal), or a literal @ in UTF-8. In CSS content, use \0040 or \40.U+0040 (decimal 64).@, or when you want the character spelled out explicitly in generated markup. Otherwise UTF-8 literal is standard.@, @, or @ in HTML. CSS uses backslash escapes inside content. Same glyph, different layer.@ maps to U+0040.Explore More HTML Entities!
Discover 1500+ HTML character references — currency symbols, arrows, math operators, emojis, and more.
About the author
8 people found this page helpful