Tooltip

Hover and focus descriptions with delays, placement and rich templates.

Playground

Change the inputs, watch the outputs and copy the usage code.

Arrow geometry for a tooltip: resolved side, offset and padding.

Inputs

Placement

Arrow size (px)

Arrow padding (px)

Offset (px)

Tooltip

Loading demo…

With an arrow

Loading demo…

$ npm install @quartz-headless/core @quartz-headless/primitives

// exports
import { TooltipDirective } from '@quartz-headless/primitives';

Prefer owning the source? Copy it with the CLI.