Tooltip

A short label shown when hovering or focusing an element.

The Tooltip shows a short label on hover or focus. Wrap your app (or the demo area) in TooltipProvider, then compose Tooltip, TooltipTrigger, and TooltipContent.

Preview

Usage

Installation

$ npx shadcn@latest add https://spark-ui-olive.vercel.app/r/tooltip.json

Properties

PropTypeDefaultDescription
delayDurationnumber700TooltipProvider only: delay in ms before tooltips open.
sideOffsetnumber4TooltipContent only: distance from the trigger.
classNamestringAdditional CSS classes.