• Light
  • Dark
  • System
v.0.1.1

Tailwind CSS Animations

Beautiful animations ready to use for your project.

1. Install the dependency
            
npm install @diegosalasmartinez/tailwind-animations
2. Add to your configuration
            
import animations from '@diegosalasmartinez/tailwind-animations'

export default {
    // ...rest of the options
    plugins: [animations],
}

blink

blurred-fade-in

bounce-fade-in

contract-horizontally

contract-vertically

expand-horizontally

expand-vertically

fade-in

fade-in-down

fade-in-left

fade-in-right

fade-in-up

fade-out

fade-out-down

fade-out-left

fade-out-right

fade-out-up

flash

flip-horizontal

flip-in-x

flip-in-y

flip-out-x

flip-out-y

flip-vertical

flip-x

flip-y

float

hang

heartbeat

horizontal-bounce

horizontal-vibration

jiggle

jump

pop

pulse-fade-in

roll-in

roll-out

rotate-180

rotate-360

rotate-90

rotate-in

rotate-out

rotational-wave

rubber-band

shake

sink

skew

slide-in-bottom

slide-in-left

slide-in-right

slide-in-top

slide-out-bottom

slide-out-left

slide-out-right

slide-out-top

slide-rotate-in

slide-rotate-out

slide-up-fade

spin-clockwise

spin-counter-clockwise

squeeze

sway

swing

swing-drop-in

tada

tilt

vertical-bounce

wobble

zoom-in

zoom-out