Skip to content

Tooltip

Tooltips display brief helper text when users hover or focus an element.

Positions

Tooltips can appear on any side of the trigger element.

On Different Elements

Tooltips can wrap any element — buttons, badges, or inline text.

NewHover this text
PropTypeDefaultDescription
contentstringThe text displayed inside the tooltip.
position"top" | "bottom" | "left" | "right""top"Which side of the trigger the tooltip appears on.
delaynumber200Delay in milliseconds before the tooltip appears on hover.
childrenReactNodeThe trigger element that the tooltip wraps.

Related Components