Browse components
Warm Tooltip
A tooltip that springs out of its trigger with a soft bounce, then drifts and leans after the pointer on a warm glow. Opens on focus, closes on Escape.
Installation
npx shadcn@latest add @glint-ui/warm-tooltipFirst time using @glint-ui? Add the registry to components.json once, or install by URL: npx shadcn@latest add https://glint-ui-seven.vercel.app/r/warm-tooltip.json
Usage
import { WarmTooltip } from "@/components/ui/warm-tooltip";
<WarmTooltip content="Add to favorites">
<button aria-label="Favorite"><Heart /></button>
</WarmTooltip>Props
| Prop | Type | Default | Description |
|---|---|---|---|
| content | string | "Add to favorites" | Tooltip text (any ReactNode). |
| side | "top" | "bottom" | "top" | Which side of the trigger. |
| delay | number | 150 | Ms before opening. |
| follow | number | 0.3 | How far the bubble drifts toward the pointer. |
| glow | string | "#fb923c" | Warm glow color. |
| children | ReactNode | — | One focusable trigger element; it gets aria-describedby while open. |
| className | string | — | Extra classes for the root element. |