HTML Entity for Heavy Black Heart (❤)

Beginner
5 min read
Updated: Sep 2026
1 example
Unicode U+2764

What Is Heavy Black Heart?

Heavy black heart (❤) is the Unicode character at U+2764 in Dingbats. Official name: HEAVY BLACK HEART. It is widely used for favorites, likes, and decorative “love” or “save” cues in UI.

Remember
Character     ❤
Unicode       U+2764
Hex entity    ❤
Decimal       ❤
CSS escape    \2764
Named entity  (none)
Meaning       heavy heart (favorites / likes)
Not the same  ♥ (♥) · ♡ · ❣

Prefer ❤ or ❤ in HTML (no named form). You can also type ❤ in a UTF-8 document. For the playing-card heart suit, use ♥ (♥).

Quick Reference

One table for every form you will actually use.

FormCodeWhere it goes
Named entityNone—
Hex entity❤HTML markup (preferred)
Decimal entity❤HTML markup
Direct character❤HTML text (UTF-8)
CSS escape\2764Stylesheet content

When to Use Which

SituationUse
Favorite / like / decorative heart❤ plus visible text or aria-label
Playing-card heart suitBlack heart suit — ♥ (♥)
White / outline heart suitWhite heart suit — ♡ (♡)
Plain ASCIIWrite <3 or the word “Favorite”
Generated text via ::before / ::aftercontent: "\2764"

Live Preview

Symbol alone, in a sample label, and next to related forms.

Glyph ❤
Large glyph ❤
Sample ❤ Add to favorites
Compared ❤   ♥   ♡   ❣
With entities Hex: ❤ | Decimal: ❤

Complete HTML Example

One page that shows heavy black heart with hex, decimal, CSS escape, and a typed character. Use View Output or open the live editor.

Hex + Decimal + CSS + Typed

Four ways to display ❤ in HTML and CSS.

html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Heavy Black Heart (U+2764) in HTML</title>
  <style>
    #point::after {
      content: "\2764";
    }
  </style>
</head>
<body>
  <p>Built with Hex: &#x2764;</p>
  <p>Built with Decimal: &#10084;</p>
  <p id="point">Built with CSS: </p>
  <p>Typed: ❤</p>
  <p><span aria-label="Favorite">&#x2764; Add to favorites</span></p>
  <p>Heart suit: &hearts;</p>
</body>
</html>
Try It Yourself

How It Works

1. Hex: &#x2764; inserts code point U+2764 → ❤.

2. Decimal: same code point as 10084 → &#10084;. Same visual as hex.

3. CSS: use \2764 in content (not an HTML entity). #point::after appends ❤.

4. Typed: paste ❤ in a UTF-8 document when you need this dingbat heart. Prefer aria-label or nearby prose such as “Favorite” so meaning is clear to everyone.

Pitfalls & Tips

Common mistakes when working with heavy black heart.

Name

No named entity

There is no HTML5 named entity for U+2764. Use &#x2764; or &#10084;. Do not invent &heavyheart;.

♥

Not &hearts;

&hearts; is ♥ (U+2665, black heart suit). Heavy black heart is ❤. Related shapes — different code points.

Color

Emoji fonts may draw it red

Many systems render U+2764 as a red emoji heart. The Unicode name is still HEAVY BLACK HEART — color is a font/presentation choice.

Font

Font coverage

Some fonts omit Dingbats. If ❤ is missing, fall back to text (“Favorite”) or a font with U+2764 coverage.

CSS vs HTML

Do not mix escapes

\2764 belongs in CSS strings. &#x2764; / &#10084; belong in HTML.

a11y

Add accessible text

Screen readers may not announce ❤ clearly. Prefer aria-label="Favorite" or nearby prose for likes and saves.

Semicolon

End references

Always finish entities with ; — write &#x2764;, not &#x2764.

Browser Support

Heavy black heart (U+2764) and its entity forms (&#x2764;, &#10084;, CSS \\2764) are supported in all mainstream browsers. Visible glyphs depend on Dingbats or emoji font coverage.

✓ Universal support

Heavy Black Heart (&#x2764;)

Encode with hex, decimal, CSS escape, or type the character — same code point 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+2764 Full support

Bottom line: Prefer &#x2764; in HTML (no named form). Use &#10084; when decimal form is required, and \\2764 only inside CSS content.

Key Takeaways

  • Unicode: heavy black heart is U+2764 (decimal 10084) — glyph ❤.
  • HTML: no named entity — use &#x2764; / &#10084; / type ❤.
  • CSS: use \2764 inside content for generated text.
  • Meaning: ❤ ≠ &hearts; (♥) — add accessible text for likes.

One line: U+2764 → &#x2764; / &#10084; / CSS \2764 (no named form).

Frequently Asked Questions

Use &#x2764; (hex), &#10084; (decimal), type ❤ directly in UTF-8, or the CSS escape \2764 in content. There is no named HTML entity for U+2764.
U+2764 (HEAVY BLACK HEART). Hex 2764, decimal 10084. It belongs to the Dingbats block (U+2700–U+27BF).
No. HTML5 does not define a named entity for U+2764. Prefer &#x2764; or &#10084;. The named entity &hearts; is a different character (U+2665).
Use it for favorites, likes, and decorative hearts in UI. For the playing-card heart suit, use &hearts; (U+2665). Always pair meaningful hearts with accessible text.
HTML numeric entities (&#10084; or &#x2764;) go in markup. The CSS escape \2764 goes in stylesheet strings (usually content on ::before/::after).
No. Heavy black heart is U+2764 (❤). &hearts; is U+2665 (♥, BLACK HEART SUIT). Related heart shapes — different code points.

Did you know?

Heavy black heart is Unicode U+2764 (decimal 10084) — glyph ❤ (HEAVY BLACK HEART) in Dingbats. There is no HTML5 named entity; use &#x2764; or &#10084;. Do not confuse it with &hearts; (♥, U+2665 black heart suit). On many systems emoji fonts draw U+2764 in red, but the code point name is still heavy black heart. Prefer nearby text or aria-label (for example “Favorite”).

Next: Heavy Check Mark

Learn the HTML entity for heavy check mark (U+2714).

Heavy check mark tutorial →

About the author

Mari Selvan M P
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.

8 people found this page helpful