Component · C-035

Tooltip

A short label that appears on hover or keyboard focus. It explains a control; it never holds essential information.

Install

Install koten-theme first when the project has no Koten tokens yet.

npx shadcn@latest add https://koten.codehive.com.co/r/tooltip.json

Requirements

Portaled popup: The popup mounts in BaseTooltip.Portal to escape table and panel scrolling; its Positioner places it next to the trigger.

Accessibility

It appears on hover and on keyboard focus, not only with the pointer.
It describes the trigger and never replaces it: the accessible name stays on the trigger.
Escape hides it without moving focus, and it never contains interactive controls.

Read the whole page