Tailwind CSS & daisyUI
A Demonstration of Transitions, Transforms, and Animations
Transitions
Hover over the elements to see the transition effects.
All
transition-all
Colors
transition-colors
Opacity
transition-opacity
Shadow
transition-shadow
Transform
transition-transform
Timing & Duration
Explore different speeds and easing functions.
Duration 150ms
Duration 500ms
Ease-In
Ease-Out
Delay 500ms
Transforms
See how elements can be manipulated in 2D space.
Animations
Continuous and eye-catching preset animations.
animate-spin
animate-ping
animate-pulse
animate-bounce