Tooltip
Types
Hover tooltip (default)
Toggle tooltip
Themes
Dark (default)
Light
Positions
Auto (default)
Top
Top-right
Top-left
Bottom
Bottom-right
Bottom-left
Delay
Basic usage
Delay: 1000ms
Creating tooltips with method
Default config
Basic usage
The definition provides inline additional help or defines a term. It may be used on the label of a UI element, on a word embedded in a paragraph, or in compact spaces such as data tables where icons clutter the UI. You can use definition tooltips on headers, body copy, or labels.
With scrollTo action
The Opera Design System is powerful, extensible, and feature-packed frontend toolkit. Build and customize with tailwindcss, utilize prebuilt UI system and components, and bring projects to life with powerful JavaScript plugins.