Chapter 72: Icons Tabletop Gaming
Icons Tabletop Gaming” (yes, it’s officially Icons Tabletop Gaming on the site — plural).
This is the exact reference page we’ve been following: a dedicated cheat-sheet on W3Schools listing free Font Awesome 5 icons in the Tabletop Gaming category.
URL (still 100% working in February 2026): https://www.w3schools.com/icons/fontawesome5_icons_tabletop_gaming.asp
It’s right after “Status” or “Summer” (depending on sorting) and before “Text Formatting” in the sidebar. The page has the usual intro: “Tabletop Gaming Icons The table below shows the Free Font Awesome 5 Tabletop Gaming icons:” followed by a nice table with icon previews, class names (like fas fa-dice-d20), unicode values, and “Try it” buttons so you can test live.
1. What is the “Icons Tabletop Gaming” Page?
It’s a specialized reference list showing only the tabletop gaming / RPG / board game icons from Font Awesome 5 free edition.
These icons represent classic tabletop gaming elements:
- Dice (d4, d6, d8, d10, d12, d20)
- Card suits (spades, hearts, diamonds, clubs)
- Chess pieces (overlap with Chess category)
- Playing cards
- Game tokens / counters
- Board game pawns
- Role-playing game symbols
Perfect for:
- Tabletop RPG websites (D&D, Pathfinder, Call of Cthulhu)
- Board game club / shop pages
- “Game Night” event invites
- Dice roller apps / tools
- Trading card game (MTG, Pokémon, Yu-Gi-Oh) communities
- Miniature wargaming / Warhammer-style sites
- “Roll for Initiative” buttons
- Campaign / session trackers
- Geek / nerd culture blogs
In Font Awesome 5 free, this category is quite small — exactly 11 icons (all solid fas style). No fancy animated dice or card backs in free v5 (those came later in Pro or v6+). But these 11 are clean, recognizable, and used everywhere for tabletop & RPG themes.
2. The complete free Tabletop Gaming Icons in Font Awesome 5
Here they are — straight from the W3Schools table:
| Icon Preview | Class Name | Unicode | Description / Most common use |
|---|---|---|---|
| 🎲 | fas fa-dice | | Generic six-sided die (random face) |
| 🎲 | fas fa-dice-d4 | | Four-sided die (tetrahedron) – very common in RPGs |
| 🎲 | fas fa-dice-d6 | | Standard six-sided die |
| 🎲 | fas fa-dice-d8 | | Eight-sided die |
| 🎲 | fas fa-dice-d10 | | Ten-sided die (often used for percentages) |
| 🎲 | fas fa-dice-d12 | | Twelve-sided die |
| 🎲 | fas fa-dice-d20 | | Twenty-sided die – the most iconic RPG die (D&D) |
| ♠ | fas fa-diamond | | Diamond card suit |
| ♥ | fas fa-heart | | Heart card suit (overlap with Emoji/Health) |
| ♣ | fas fa-club | | Club card suit |
| ♦ | fas fa-spade | | Spade card suit |
That’s the complete free list — 7 dice + 4 card suits.
No:
- Chess pieces (they are in the separate Chess category)
- Playing card backs
- Poker chips / casino tokens
- Miniature figurines
- Board game pieces (pawn, knight, rook – only in Chess)
- Tarot card symbols
- Board game box / dice bag
3. Real Code Examples – How to Use Tabletop Gaming Icons
Example 1: RPG / D&D Club Header (very common)
|
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
<!-- FA5 CDN in <head> --> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"> <div style="text-align: center; padding: 60px 20px; background: #1a0033; color: white; border-radius: 0 0 20px 20px;"> <i class="fas fa-dice-d20 fa-8x" style="color: #ff9800; margin-bottom: 25px;"></i> <h1>Hyderabad Tabletop RPG Club</h1> <p style="font-size: 1.7rem;"> <i class="fas fa-dice-d4" style="margin: 0 8px;"></i> <i class="fas fa-dice-d6" style="margin: 0 8px;"></i> <i class="fas fa-dice-d8" style="margin: 0 8px;"></i> <i class="fas fa-dice-d10" style="margin: 0 8px;"></i> <i class="fas fa-dice-d12" style="margin: 0 8px;"></i> <i class="fas fa-dice-d20" style="margin: 0 8px;"></i> Every Saturday – All Systems Welcome </p> </div> |
Example 2: Dice Roller / “Roll Initiative” Button
|
0 1 2 3 4 5 6 7 8 9 |
<button style="background: #673ab7; color: white; padding: 18px 40px; border: none; border-radius: 50px; font-size: 1.4rem; cursor: pointer; box-shadow: 0 4px 12px rgba(103,58,183,0.4);"> <i class="fas fa-dice-d20" style="margin-right: 12px; font-size: 1.8rem;"></i> Roll for Initiative! </button> |
Example 3: Card Game / Poker Night Invite
|
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<div style="text-align: center; padding: 50px; background: #212121; color: white; border-radius: 12px; max-width: 600px; margin: 40px auto;"> <div style="font-size: 6rem; margin-bottom: 20px;"> <i class="fas fa-diamond" style="color: #ff1744;"></i> <i class="fas fa-heart" style="color: #e91e63;"></i> <i class="fas fa-club" style="color: #4caf50;"></i> <i class="fas fa-spade" style="color: #212121;"></i> </div> <h2>Poker Night – Friday 8 PM</h2> <p style="font-size: 1.4rem;"> Bring your best bluff • Snacks & drinks provided </p> </div> |
Example 4: “Critical Success” / “Nat 20” Badge
|
0 1 2 3 4 5 6 7 8 9 |
<div style="display:inline-flex; align-items:center; gap:12px; padding:12px 24px; background:#ff9800; color:white; border-radius:50px; font-size:1.3rem;"> <i class="fas fa-dice-d20" style="font-size:1.8rem;"></i> <span>Nat 20 – Critical Success!</span> </div> |
4. Teacher Summary – Quick Recap
Font Awesome 5 Tabletop Gaming Icons = W3Schools’ page listing free tabletop/RPG/board game icons:
- 7 dice: fa-dice-d4 / d6 / d8 / d10 / d12 / d20 + generic fa-dice
- 4 card suits: diamond ♦, heart ♥, club ♣, spade ♠
That’s it — exactly 11 free icons in total.
Perfect for:
- D&D / Pathfinder / RPG campaign sites
- Board game nights / clubs
- Dice roller apps / tools
- Trading card game communities
- Poker / card game events
Got it now? Want me to:
- Build a full “Tabletop RPG Club” or “D&D Campaign” mini-page demo with these dice & suits?
- Show differences vs newer Font Awesome versions (many more dice, cards, tokens in FA6/7)?
- Compare FA5 vs FA6/7 tabletop gaming icons?
- Or next category like “Icons Status” or “Icons Summer”?
Just tell teacher — roll for initiative! 🎲🎲🎲🚀
