Tooltip
Contextual hints and rich previews shown on hover.
Default
A short hint revealed on hover or focus.
On a badge
Attach a tooltip to a badge to explain its status.
Rich content
Tooltips with headings and multiple lines of detail.
Error state
A destructive-styled tooltip for warnings and errors.
Hover card — stats
A rich hover card surfacing key metrics at a glance.
Hover card — project
Preview project details without leaving the page.
Hover card — tasks
Show a summary task list on hover.
API reference
A hover hint: a Provider shares timing, a Trigger reveals a portalled Content on hover/focus.
Full props on Base UI TooltipAnatomy
Tooltip | Root managing a single tooltip's open state. |
TooltipTrigger | Element that shows the tooltip on hover or focus. |
TooltipContent | Portalled, positioned popup with an arrow. |
TooltipProvider | Shares the hover delay across tooltips (defaults to 200ms). |