Components

VTooltip

Vuero offers a very simple versatile v-tooltip directive. The example below is the default and basic version. There are 6 default positions accessible with modifiers: .top-left, .top-right, .bottom-left, .bottom, .bottom-right.

Top LeftTop CenterTop RightBottom LeftBottom CenterBottom Right

Tooltip Colors

Vuero tooltips can have different colors that can be changed with a simple CSS class. Available color classes are: .light, .primary, .info, .success, .warning and .error.

DefaultLightPrimaryInfoSuccessWarningError

Tooltip Shapes

Vuero tooltips can have different shapes, based on what you need in your design. Available shape modifiers are: .rounded and .bubble. Note that the bubble tooltip has uppercase set by default and doesn't have a tooltip arrow.

DefaultRoundedBubble