Windi CSSAnimation
Utilities for animating elements with CSS animations.
none
spin
ping
pulse
bounce
CSS
Customizing
windi.config.js
export default {
theme: {
extend: {
animation: {
'spin-slow': 'spin 3s linear infinite',
},
},
},
}
To add new animation @keyframes, use the keyframes section of your theme configuration:
windi.config.js
export default {
theme: {
extend: {
keyframes: {
wiggle: {
'0%, 100%': { transform: 'rotate(-3deg)' },
'50%': { transform: 'rotate(3deg)' },
},
},
},
},
}