Tooltip
A quiet label that rises above its trigger on hover. It is hover-only, so keep anything a keyboard or touch user needs out of it.
A short label
Controls
Code
import { Tooltip } from "@/components/ui/kit/feedback";
<Tooltip label="A short label">
<Button variant="quiet">Hover me</Button>
</Tooltip>Every state
A short label
Usage
Tokens it uses
| --ink | … |
|---|---|
| --paper | … |
| --font-label | … |
Values are read live from the stylesheet, so they follow the site theme.