Hover Card
Rich preview on hover or focus.
shadcn/ui · new-york-v4 · synced Aug 28, 2026shadcn/uinew-york-v4 · synced Aug 28, 2026
Installation
import { HoverCard, HoverCardTrigger, HoverCardContent } from "@aspyn-io/kit";User hover card
Hover a teammate to see their role, timezone, and contact details.
Placement
Position the card with side (top / right / bottom / left) and align (start / center / end) on HoverCardContent.
Notes
- HoverCard is mouse/keyboard-focus only and non-interactive on touch: keep content supplemental, never the only path to information.