Tooltip

FreeNew

Customize

This item has no props to tune. Use the lens above to change theme, density, direction and more.

Guide and examples

Installation


pnpm dlx shadcn@latest add tooltip

Usage

import {
  Tooltip,
  TooltipContent,
  TooltipTrigger,
} from "@/components/ui/tooltip"

<Tooltip>
  <TooltipTrigger>Hover</TooltipTrigger>
  <TooltipContent>
    <p>Add to library</p>
  </TooltipContent>
</Tooltip>

Notes

Tooltip wraps itself in a TooltipProvider, so a single tooltip works without a provider. Wrap your app in one TooltipProvider to share the open and close delays.

API reference

See the Radix Tooltip documentation for the full list of props.