Tooltip

Feedback

Contextual hover information with arrow positioning, delay configuration, and portal rendering

Basic Usage

Positions

With Delay

Usage Guidelines

When to Use

  • Icon explanations
  • Truncated text
  • Feature hints

Accessibility

  • Shows on focus not just hover
  • aria-describedby on trigger

Performance

  • Lazy render on trigger
  • Efficient positioning

Common Mistakes

  • Putting essential info in tooltip only
  • Tooltip on touch without alternative

Frequently Asked Questions

Yes, Tooltips use aria-describedby and appear on focus for keyboard users.
No, use Popover for interactive content. Tooltips are for text hints only.

View on GitHub

See the full source code on GitHub

Related Components

View all
Alert

Contextual messaging with severity variants, dismissal, icons, and action button integration

Backdrop

Backdrop overlay for modals with blur effects and click-to-close functionality

Progress

Progress indicator with determinate/indeterminate modes, labels, and variant system including gradients

Result

Full-page status displays for success, error, and HTTP status codes (404, 403, 500) with action buttons

Previous

ThemeToggle

Next

Textarea