Tooltip

Tooltips add lightweight supporting context to a trigger without permanently taking up layout space. They work best for short clarifications, not essential instructions.

Basic Usage

Pair a trigger with concise tooltip content for short explanatory copy.

Action Hints

Tooltips are especially useful on compact icon or utility actions where the visible label would otherwise be too noisy.

Placement

Choose the side that keeps the tooltip close to its trigger without covering nearby UI.

Keyboard Trigger

Tooltips should be available when a user reaches the trigger by keyboard focus.

API reference

Tooltip wraps Base UI Tooltip. Use the Base UI API reference for provider delay, trigger behavior, controlled state, portal behavior, and positioning props.