Hover Card
Delayed hover and focus preview card for profiles and link previews.
Copy a prompt for your AI coding tool with the source, dependencies and usage
Props
HoverCardProps
Also accepts all props of Omit<React.ComponentProps<"span">, "children">
| Prop | Type | Default | Description |
|---|---|---|---|
| trigger* required | React.ReactNode | — | Element that reveals the card, usually a link |
| children* required | React.ReactNode | — | Card content |
| openDelay | number | 200 | — |
| closeDelay | number | 150 | — |
| side | "top" | "bottom" | "bottom" | — |
| align | "start" | "center" | "end" | "center" | — |
| width | number | 288 | — |
Install
$ npx shadcn@latest add https://chromotion.dev/r/hover-card.json