tool-tip

A web component for tooltips. Hover over elements to see the tooltip.

Basic Usage

Placement

Tooltips can be positioned on any side of the target element.

Click Trigger

Tooltips can be triggered by click instead of hover.

Programmatic Control

Use the open attribute or show()/hide() methods.

Disabled State

Tooltips can be disabled.

Inline Text

Tooltips work on any element, including inline text.

This is a paragraph with a HTML tooltip, and another one for CSS .

Distance & Skidding

Control the distance from the target and lateral offset.

Custom Styling

Customize appearance with CSS custom properties.

Hover Delay

Tooltips can have a delay before showing up (in milliseconds).

Long Content

Tooltips automatically wrap long content.