Docs
Hover Card

Hover Card

For sighted users to preview content available behind a link.

Component Source Primitive API Reference

Installation ​

bash
npx shadcn-vue@latest add hover-card

Usage ​

vue
<script setup lang="ts">
import {
  HoverCard,
  HoverCardContent,
  HoverCardTrigger,
} from '@/lib/registry/default/ui/hover-card'
</script>

<template>
  <HoverCard>
    <HoverCardTrigger>Hover</HoverCardTrigger>
    <HoverCardContent>
      The React Framework – created and maintained by @vercel.
    </HoverCardContent>
  </HoverCard>
</template>
Edit this page on GitHub