Tooltip

A popup that displays information related to an element when the element receives hover focus.

Default

Hover over the buttons to see tooltips.

Add to library
Add new item

Positions

Tooltip placement on all four sides.

Tooltip on top
Tooltip on bottom
Tooltip on left
Tooltip on right

With Keyboard Shortcut

Tooltip with additional keyboard shortcut hint.

Save changes ⌘S
Copy to clipboard ⌘C
Delete item ⌘⌫

Toolbar with Tooltips

Icon buttons with tooltip labels.

Edit
Copy
Align
Settings