Skip to main content

Overlays and menus

Tooltip

Render a small hover or focus tooltip. A polite little whisper of extra information.

Curated demo

Reference

Render a small hover or focus tooltip. A polite little whisper of extra information.

  • Use Tooltip for supplemental, non-essential copy only.
  • Never hide critical instructions in a tooltip. If they need to read it to succeed, put it on the page!

Example snippet

<Tooltip id="copy-tooltip" text="Copy install command" />