Skip to content

Tooltip ​

Displays a tooltip when the mouse hovers over or clicks on an element. (If you think this component looks a lot like Popover, congratulations, you're right! Tooltip is a wrapper around Popover 😁).

Basic Usage ​

The most basic tooltip.

Trigger Methods ​

The trigger attribute can be used to set different trigger methods.

Tooltip Style ​

The content-class attribute can be used to set the style of the tooltip.

Arrow ​

The arrow attribute can be used to set whether to display the arrow.

Attributes ​

Attribute NameDescriptionTypeDefault Value
content-classContent class namestring-
contentContent to displaystring-
placementPosition where the tooltip appearstop | bottom | left | right | toptop
triggerTrigger methodhover | click | hoverhover
arrowWhether to display the arrowbooleantrue

Slots ​

Slot NameDescription
defaultElement that triggers the Tooltip display