Loading...
A Tooltip is a floating, non-actionable text label that provides explanations or contextual help about a user interface element. It appears on hover, focus, or touch, offering additional, helpful, and nonessential brief messages to clarify the element’s function.
Accessible, keyboard support
Multiple variants
Can be controlled or uncontrolled
Different sides, alignment, offsets, collision handling, managed by Floating UI
Animated with Motion, respects reduce motion
| Prop | Type | Default |
|---|---|---|
variant | enum | "default" |
Support all Root Radix API.
Support all Trigger Radix API.
Support all Portal and Content Radix API.
| Prop | Type | Default |
|---|---|---|
reduceMotion | boolean | false |
animation | AnimationProps | ― |
animationPreset | enum | "motion-blur" |
transition | Transition | ― |
transitionPreset | enumTransitionPreset | "inOutQuad" |