HTML Entity for Black Diamond Suit (♦)

Beginner

5 min read

Updated: Sep 2026

1 example

Unicode U+2666

HTML Entity for black diamond suit (♦) tutorial illustration

Definition

What Is Black Diamond Suit?

Black diamond suit (♦) is Unicode U+2666 in the Miscellaneous Symbols block. It is the filled diamonds suit used in card games and suit notation. HTML provides the named entities &diams; and &diamondsuit;.

Remember

Character     ♦
Unicode       U+2666
Hex entity    &#x2666;
Decimal       &#9830;
Named entity  &diams; (also &diamondsuit;)
CSS escape    \2666
Not the same  ♢ U+2662 (white) · ❖ U+2756 (dingbat)

All of these produce the same glyph: ♦. Prefer &diams; in hand-written HTML; type ♦ in UTF-8 when you can; use numeric or CSS forms for generated content.

Reference

Quick Reference

One table for every form you will actually use.

Form	Code	Where it goes
Direct character	`♦`	HTML text (UTF-8)
Named entity	`&diams;`	HTML markup (preferred name)
Named alias	`&diamondsuit;`	HTML markup (same glyph)
Hex entity	`♦`	HTML markup
Decimal entity	`♦`	HTML markup
CSS escape	`\2666`	Stylesheet `content`

When to Use Which

Situation	Use
Filled diamonds suit	`&diams;` or type `♦`
Outline / white diamonds	♢ (U+2662)
Decorative dingbat diamond	❖ (U+2756)
Other black suits	♣ · ♥ · ♠
Icon via CSS	`content: "\2666"` on `::before`

See it

Live Preview

Black diamond suit in common study contexts.

Inline suit Ace of ♦

Large glyph ♦

Four black suits ♣ ♦ ♥ ♠

Accessible label Diamonds

With entities Named: ♦ | Hex: ♦ | Decimal: ♦

Code

Complete HTML Example

One page that shows ♦ with hex, decimal, named entity, CSS escape, and a typed character. Use View Output or open the live editor.

Hex + Decimal + Named + CSS + Typed

Five ways to produce ♦ in a single document.

html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Black Diamond Suit (♦) in HTML</title>
  <style>
    #point::after {
      content: "\2666";
    }
  </style>
</head>
<body>
  <p>Black diamond suit using Hex Code: &#x2666;</p>
  <p>Black diamond suit using HTML Code: &#9830;</p>
  <p>Black diamond suit using Named Entity: &diams;</p>
  <p id="point">Black diamond suit using CSS Entity: </p>
  <p>Typed directly: ♦</p>
</body>
</html>

Try It Yourself

How It Works

1. Hex: U+2666 → ♦ in HTML. The browser turns it into ♦.

2. Decimal: same code point as 9830 → ♦. Same result as hex.

3. Named: &diams; (or &diamondsuit;) is the standard HTML name for U+2666 — clear in source.

4. CSS: use \2666 in content (not an HTML entity). #point::after appends that ♦ after the paragraph text.

5. Typed ♦: fine in UTF-8 source. All five lines show the same glyph.

Pitfalls & Tips

Common mistakes when working with black diamond suit (♦).

♢

Not white diamond

♦ is filled. For the outline form use ♢ (U+2662).

❖

Not the dingbat

❖ is black diamond minus white X — a decoration, not the card suit.

a11y

Say “Diamonds”

Screen readers may not announce the suit clearly. Pair the glyph with visible or visually hidden text.

Fonts

Match suit fonts

Use the same font stack for ♣ ♦ ♥ ♠ so suit glyphs look consistent.

CSS vs HTML

Do not mix escapes

\2666 belongs in CSS. &diams; / ♦ belong in HTML.

Semicolon

End references

Always finish with ; — write &diams;, not &diams.

Compatibility

Browser Support

Black diamond suit (U+2666) and its entity forms (&diams;, &diamondsuit;, ♦, ♦, CSS \\2666) are supported in all mainstream browsers. Glyph quality depends on font support for Miscellaneous Symbols.

✓ Universal support

Black Diamond Suit (♦)

Type ♦, or encode with named, hex, decimal, or CSS escape — same glyph everywhere encoding is supported.

100% Browser coverage

Google Chrome Supported

Yes

Microsoft Edge Supported

Yes

Mozilla Firefox Supported

Yes

Apple Safari Supported

Yes

Opera Supported

Yes

Internet Explorer All versions

Yes

U+2666 / entities Full support

Bottom line: Prefer &diams; or a typed ♦ for normal text. Use numeric forms when generating markup, and \\2666 only inside CSS content.

Remember

Key Takeaways

Unicode: black diamond suit is U+2666 (decimal 9830).
HTML: prefer &diams; (or ♦ / ♦).
CSS: use \2666 inside content for generated icons.
Watch out: ♦ ≠ ♢ ≠ ❖ (suit ≠ white ≠ dingbat).

One line: U+2666 → &diams; / ♦ / ♦ / CSS \2666.

Frequently Asked Questions

How do I display black diamond suit (♦) in HTML?

Use ♦ (hex), ♦ (decimal), &diams; or &diamondsuit; (named), or the CSS escape \2666 in the content property. All render ♦. You can also paste ♦ directly if your file is UTF-8.

What is the Unicode value for black diamond suit?

U+2666 (hex 2666, decimal 9830). Unicode names it BLACK DIAMOND SUIT. It belongs to the Miscellaneous Symbols block in the playing-card suit range.

Is there a named HTML entity for ♦ (U+2666)?

Yes. &diams; and &diamondsuit; both map to U+2666. Prefer &diams; in hand-written HTML; numeric forms are useful in generated markup.

How is ♦ different from ♢ or ❖?

♦ (U+2666) is the filled black diamond suit. ♢ (U+2662) is white diamond suit. ❖ (U+2756) is a dingbat diamond with a white X — not a card suit.

What is the difference between HTML code and CSS entity for ♦?

HTML entities (♦, ♦, or &diams;) go in markup. The CSS escape \2666 is used in stylesheets (usually in the content property of ::before/::after). Both render ♦.

When should I use the black diamond suit symbol?

Use ♦ for card games, Bridge notation, suit labels, and UI that needs the diamonds suit. Pair the glyph with the word Diamonds when accessibility matters.

Did you know?

Black diamond suit is Unicode U+2666 (decimal 9830) in the Miscellaneous Symbols block — official name BLACK DIAMOND SUIT. HTML’s named references are &diams; and &diamondsuit;. It is not white diamond suit (U+2662 ♢) or black diamond minus white X (U+2756 ❖).

Next: Black Feathered North East Arrow

Learn the HTML entity for the black feathered north east arrow (➶).

Next tutorial →

About the author

Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

Experience 12 years building web and cloud systems
Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

8 people found this page helpful

HTML Entity | Black Diamond Minus White X HTML Entity | Black Feathered North East Arrow