Docs
Levitate

Levitate

Displays a levitate component.

Notifications

You have 3 unread messages.

CN

Installation

Copy and paste the following code into your project.

If you have already used our Card Component, Please skip this step

Otherwise you need copy the following code

If you have already used our Avatar Component, Please skip this step

Otherwise you need copy the following code

Copy and paste the Levitate code into your project.

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: {
            levitate: {
                "0%": {
                    transform: "translateY(0)",
                },
                "30%": {
                    transform: "translateY(-10px)",
                },
                "50%": {
                    transform: "translateY(4px)",
                },
                "70%": {
                    transform: "translateY(-15px)",
                },
                "100%": {
                    transform: "translateY(0)",
                },
            },
        },
       animation: {
        levitate: "levitate 5s ease infinite",
      },
    },
  },
}
Animotion In View CardReorder Card