Tool
AnimXYZ
Composable CSS animation toolkit with utility-like classes
About
AnimXYZ animations are disabled if your browser or OS has reduced motion setting turned on. Learn more here.
AnimXYZ helps you create, customize, and compose animations for your website. Powered by CSS variables to allow a nearly limitless number of unique animations without writing a single keyframe. Save time and have complete control over how your elements move. Built for Vue, React, SCSS, and CSS, AnimXYZ will bring your website to life.
Making an animation is as simple as describing it in words. Combine a fade with a scale and drop it from the top! xyz="fade small up"
Out-of-the-box utilities not enough? Fine-tune any animation with CSS variables to your heart's content. Simple as: --xyz-translate-y: 42%;
Features
- 🌀 It's gone spiral!
- Pricing
- Open Source
- Pricing detail
- Free CSS animation system
- Platforms
- Web / CSS
Alternatives from our catalog
Tools on the same shelves as AnimXYZ, ordered by shared tags and our own comparisons. Not vendor endorsements.
- Epic SpinnersOpen Source · Web / Vue / CSS
Popular stylish spinner pack from Epicmax
same tags
- WhirlOpen Source · Web / CSS
Copyable CSS loader zoo
same tags
- Loaders.cssOpen Source · Web / CSS
Long-standing drop-in CSS loader stylesheet
same tags
- LivelyIconsOpen Source · React
oss set
same tags
- Keyframes.appFreemium · Web
Timeline UI for crafting CSS micro-animations
same tags
- AnimistaFree · Web
Go-to copy-paste CSS micro-anim generator
same tags