Colon (:) is the Unicode character at U+003A — the standard ASCII colon. It is used for time (12:30), labels (Name:), ratios in plain text, and many programming languages.
Remember
Character :
Unicode U+003A
Hex entity :
Decimal :
Named entity :
CSS escape \3A
All of these produce the same glyph: :. Prefer typing : in everyday HTML; use : when you want the named reference explicit.
Reference
Quick Reference
One table for every form you will actually use.
Form
Code
Where it goes
Direct character
:
HTML text (UTF-8) — usual choice
Named entity
:
HTML markup
Hex entity
:
HTML markup
Decimal entity
:
HTML markup
CSS escape
\3A
Stylesheet content
When to Use Which
Situation
Use
Normal HTML / prose
Type : (simplest)
Want a named reference
:
Generated / numeric-only markup
: or :
Generated text via ::before / ::after
content: "\3A"
Math proportion / ratio marks
Use ∷ (∷) or ∶ (∶) — not ASCII :
See it
Live Preview
Colon rendered in common writing contexts.
Inline textTime: 12:30
Large glyph:
Compared: ∷ ∶ ;
Monospacelabel: value
With entitiesNamed: : | Hex: : | Decimal: :
Code
Complete HTML Example
One page that shows Colon with the named entity, hex entity, decimal entity, CSS escape, and a typed character. Use View Output or open the live editor.
Named + Hex + Decimal + CSS + Typed
Five ways to produce : in a single document.
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Colon (:) in HTML</title>
<style>
#point::after {
content: "\3A";
}
</style>
</head>
<body>
<p>Colon using Named Entity: :</p>
<p>Colon using Hex Code: :</p>
<p>Colon using HTML Code: :</p>
<p id="point">Colon using CSS Entity: </p>
<p>Typed directly: :</p>
</body>
</html>
Colon using Named Entity: :
Colon using Hex Code: :
Colon using HTML Code: :
Colon using CSS Entity: :
Typed directly: :
How It Works
1. Named:: is the HTML5 named reference for U+003A → :.
2. Hex:U+003A → : in HTML. Same glyph as the named form.
3. Decimal: same code point as 58 → :. Same result as hex.
4. CSS: use \3A in content (not an HTML entity). #point::after appends that : after the paragraph text.
5. Typed :: the usual choice in UTF-8 pages. All five lines show the same glyph.
Pitfalls & Tips
Common mistakes when working with Colon entities.
Case
: ≠ ∷
Lowercase : is :. Capital ∷ is proportion ∷ (U+2237).
CSS vs HTML
Do not mix escapes
\3A belongs in CSS. : / : / : belong in HTML.
: vs ;
Different punctuation
Colon is : (U+003A). Semicolon is ; (U+003B).
Default
Just type it
In normal HTML you almost never need an entity for colon — type : directly.
Semicolon
End references
Always finish entities with ; — write : and :, not bare forms.
CSS tip
Short hex escapes
In CSS, \3A is fine when followed by a non-hex character (or use \003A). Avoid gluing hex digits to the next token.
Compatibility
Browser Support
Colon (U+003A) and its entity forms (:, :, :, CSS \\3A) are supported in all mainstream browsers.
✓ Universal support
Colon (:)
Type :, or encode with named, hex, decimal, or CSS escape — same glyph everywhere encoding is supported.
100%Browser coverage
Google ChromeSupported
Yes
Microsoft EdgeSupported
Yes
Mozilla FirefoxSupported
Yes
Apple SafariSupported
Yes
OperaSupported
Yes
Internet ExplorerAll versions
Yes
U+003A / entitiesFull support
Bottom line: Prefer typing : for everyday text. Use : when you want a named form, and \\3A only inside CSS content.
Remember
Key Takeaways
Unicode: colon is U+003A (decimal 58).
HTML: type :, or use : / : / :.
CSS: use \3A inside content for generated text.
Watch out:: ≠ ∷ (: ≠ ∷).
One line:U+003A → type : / : / : / CSS \3A.
Frequently Asked Questions
Type : directly in UTF-8 HTML, or use : (hex), : (decimal), : (named), or the CSS escape \3A in the content property. All render :.
U+003A (hex 3A, decimal 58). It is the standard ASCII colon character.
Yes. : is the HTML5 named reference for :. Note: ∷ (capital C) is a different character — proportion ∷ (U+2237).
Use it for time (12:30), labels (Name:), ratios in plain text, and code syntax. Prefer typing : in normal HTML; use : when you want the named form explicit.
HTML entities (:, :, or :) go in markup. The CSS escape \3A goes in stylesheet strings (usually content on ::before/::after).
: (U+003A / :) is the ASCII colon. ∷ (U+2237 / ∷) is PROPORTION. ∶ (U+2236 / ∶) is RATIO. Do not confuse : with ∷.
🤔
Did you know?
Colon is Unicode U+003A (decimal 58) — the familiar ASCII :. HTML named reference is :. It is not∷ (capital C), which maps to proportion ∷ (U+2237), and not ratio ∶ (U+2236 / ∶).
