Overlays

Flip Side Hint Tooltip

A hint bubble that appears on hover or keyboard focus and automatically flips to whichever side keeps it fully visible near the edge of the screen.

Using Flip Side Hint Tooltip

A hint bubble that appears on hover or keyboard focus and automatically flips to whichever side keeps it fully visible near the edge of the screen.

Try the live preview with a pointer and keyboard, then check focus visibility and the narrow layout in your own page. Use the plate number or slug when asking your coding agent to fetch this component.

Props: side, openDelay, accentColor

Which frameworks are available?

The catalog lists these versions: react, vue, svelte, astro, html. The live preview on this page runs React.

How do I access the implementation?

The code, framework versions and installation commands are available in the workbench above.

Connect your agent

Nearby

2137Cursor-chasing tooltipOverlaysA hint bubble that pops in on hover or focus and can glide to trail the pointer as it moves across the trigger.

1983Instant Hint TooltipOverlaysA small label that fades and scales into view beside an element on hover or keyboard focus, giving a quick hint without adding visible clutter.

2458Underline hint tooltipOverlaysA dotted-underline word that reveals a short hint bubble above or below it on hover or keyboard focus, driven entirely by CSS.

2214Resizing hint tooltipOverlaysA hover label whose bubble smoothly resizes itself when its text is longer or shorter, instead of snapping between sizes.

2257Toolbar icon tooltipOverlaysA row of icon-only toolbar buttons that pop a small arrow-pointed label near whichever one is hovered or focused.

2096Traveling Toolbar TooltipOverlaysA single floating tooltip that glides smoothly from one toolbar icon to the next as hover or focus moves between them, instead of disappearing and reappearing each time.