OverlaysTooltip

Tooltip

Tooltips are meant to be used for supplemental content and should never be used for critical information the user needs to complete a task.

Prop	Type	Required	Default	Description
`children`	`ReactElement`	Yes	—	The target element.
`content`	`string \| ReactElement`	Yes	—	The content of the tooltip.
`id`	`string`	—	—	the id
`placement`	`top`\|`right`\|`bottom`\|`left`	—	`top`	Where, in relation to the target, to place the tooltip.
`positionStrategy`	`absolute`\|`fixed`	—	`absolute`	Which (CSS) positioning strategy to use.
`verticalOffset`	`number`	—	—	Which (CSS) positioning strategy to use.

Prop	Type	Required	Default	Description
`content`	`TooltipProps['content']`	Yes	—	The content of the tooltip.
`id`	`string`	—	—	The ID of the element.
`placement`	`top`\|`right`\|`bottom`\|`left`	—	—	—

Tooltip — Guidelines

What tooltips are for, their content constraints, and when to reach for one over other clarification patterns.

Tray

A container that accepts free-form content, available in several sizes.