Skip to content
DEV VAULT
Frameworks
Tools
Packages
Backend Concepts
DevOps
Platforms
Effects
Guide
Frameworks
Tools
Packages
Backend Concepts
DevOps
Platforms
Effects
Guide
Home
/
Effects
/
Tooltip
/
Edit
Effects
Edit entry
Tooltip
Core details
Title
*
Description
*
A Tooltip is a small overlay popup showing hints on hover/focus, using position: absolute and transitions for non-intrusive help. Accessible with aria-describedby.
Category
*
Frameworks
Tools
Packages
Backend Concepts
DevOps
Platforms
Effects
Usage & Trade-offs
All fields support markdown. Use concise bullets and concrete situations.
When to use it
*
Use Tooltip when: - Clarifying icons/labels. - Form field help. - Dense UIs. - Onboarding.
Pros
*
- Saves space. - Improves usability. - Customizable. - Keyboard support. - Simple CSS.
Cons
*
- Mobile touch issues. - Overlap problems. - Screen reader dupes. - Long text truncate. - Z-index fights.
Notes
Note: data-tooltip attr. ::after ::before. Focus visible.
Cancel
Save Changes