Free and open-source React hover card components built for modern applications and websites. These hover cards are built using React Aria and styled with Tailwind CSS.
Tooltip renders a plain-text description with role="tooltip" and is meant to be glanced at, never interacted with. HoverCard renders arbitrary rich content — an avatar, a bio, a button — in a Popover/Dialog surface, so the content can include real interactive elements like a Follow button.
Wrap it in HoverCardTrigger, which renders a focusable, unstyled button. Skip it when the trigger is already interactive on its own, such as a Link or a Button, since wrapping it again would add a redundant tab stop.
No — focusing the trigger (e.g. by pressing Tab) opens the card immediately, with no delay, so keyboard users reach the same content mouse users do.
Pass openDelay (default 400ms) and closeDelay (default 200ms), both in milliseconds. The close delay gives the pointer time to travel from the trigger into the card itself without it closing first.
Like every other overlay in the library, pressing Escape or clicking outside the card closes it, in addition to moving the pointer (or focus) away.
Yes — pass isOpen and onOpenChange to drive it externally instead of letting it manage its own state.