← Vois design previews
Components · Job 7 · Contextual info

Tooltip vs Popover vs HoverCard

WCAG requires interactive content to be reachable by keyboard — Tooltip content isn't reliably focusable, so keep it passive and under ~25 words. Popover is click-triggered and can hold rich, interactive content. HoverCard previews on hover without requiring a click.

Tooltip · passive, ≤25 words
Synced 2 minutes ago

Hover or focus the button. No interactive content lives inside.

Popover · click-triggered, rich content

Share this document

Native Popover API — keyboard-dismissible, holds a real form control.

HoverCard · hover preview
@ada-lovelace
AL

Ada Lovelace

Engineering · joined 2019

Preview only — the real destination is still the link itself.