Docs
Tooltip

Tooltip

A popup that provides additional information when an element receives keyboard focus or the mouse hovers over it.

Loading...

Installation

Update tailwind.config.js

Add the following animations to your tailwind.config.js file:

tailwind.config.js
/** @type {import('tailwindcss').Config} */
module.exports = {
  theme: {
    extend: {
       keyframes: {
            shake: {
            "0%": { transform: "rotate(0deg)" },
            "25%": { transform: "rotate(7deg)" },
            "50%": { transform: "rotate(-7deg)" },
            "75%": { transform: "rotate(1deg)" },
            "100%": { transform: "rotate(0deg)" },
            },
        },
       animation: {
         shake: "shake 1s ease-in-out both",
      },
    },
  },
}

Copy and paste the tooltip code into your project.

Alert