Hover Card

Docs

Hover Card

Hover Card component is designed for sighted users, providing a visually appealing and interactive way to preview content available behind a link. It enhances the user experience by allowing users to hover over a link or trigger element, revealing a card with additional information, images, or details related to the content. The Hover Card is particularly useful for providing quick previews or supplementary information without navigating away from the current page, promoting a seamless browsing experience.

Radix UI NPM

Installation

yarn add @camped-ui/hover-card

Usage

import {
  HoverCard,
  HoverCardContent,
  HoverCardTrigger,
} from "@camped-ui/hover-card";

<HoverCard>
  <HoverCardTrigger>Hover</HoverCardTrigger>
  <HoverCardContent>
    The React Framework – created and maintained by @vercel.
  </HoverCardContent>
</HoverCard>

Form Input