Hand Display
A fanned card hand component with selection, hover effects, and customizable sizing.
Standard Hand
Click cards to select them. Click outside or press Escape to deselect.
Fireball
SPELL
Shield
ARMOR
Dragon
CREATURE
Void
MYTHIC
Nature
ENCHANT
Your Hand
Premium Hand
Legendary cards with special effects like polychrome and gold.
Phoenix
LEGENDARY
Infinity
ARTIFACT
Cosmos
CELESTIAL
Legendary Cards
Size Variants
Extra Small (xs)
Fireball
SPELL
Shield
ARMOR
Dragon
CREATURE
Usage
import { Hand, Playmat } from "@/components/playset-blocks"
const cards = [
{ title: "Fireball", category: "SPELL", theme: "red", icon: <Flame /> },
{ title: "Shield", category: "ARMOR", theme: "blue" },
]
<Playmat label="Your Hand">
<Hand cards={cards} size="sm" />
</Playmat>