Tooltips on touch

1. Can you use tooltips on mobile?
2. Should tooltips be hover or click?
3. What can I use instead of tooltips?
4. How do I add a tooltip?

Can you use tooltips on mobile?

Tooltips aren't just for web—they're one of the most popular and effective UI patterns for mobile apps, too.

Should tooltips be hover or click?

Support both mouse and keyboard hover.

Tooltips that appear only on mouse hover are inaccessible for users that rely on keyboards to navigate. Be inclusive in your design and ensure that your tooltips are accessible via keyboards.

What can I use instead of tooltips?

You can use modals, hotspots, and in-app messages to replace tooltips.

How do I add a tooltip?

Basic Tooltip

HTML: Use a container element (like <div>) and add the "tooltip" class to it. When the user mouse over this <div>, it will show the tooltip text. The tooltip text is placed inside an inline element (like <span>) with .