CSS Animation Libraries
I’m willing to use only CSS animations, no JS. It’s a common to do just that, CSS3 for animations and a very small JS just for triggering start of an animation when element enters viewing area by scrolling.
Animate.css + some tiny JS
As for CSS3-only animation libraries, the best one is
AIV - Animate In View is small JS library that only changes CSS class when element condition is triggered. Can be easily used with Animate.css or anything else CSS. I like it because is so versatile for me also
WOW.js is exactly that, Animate.css and JS combo that just works. Besides AOS, it is the most popular solution out there.
AOS is already a CSS + JS combo, and seems to be the most popular. Stated somewhere: every aspect of animation is handled by CSS. JS is only for triggering.
Oxygen Builder is using AOS to animate their “On-Scroll Effects”.
The idea behind AOS is straightforward: watch all elements and their positions based on settings you provide them. Then add/remove the class “aos-animate”.
More about library: https://css-tricks.com/aos-css-driven-scroll-animation-library/
- There is also amazing ScrollMagic
… and many others
- A free repository for community components using Tailwind CSS: Tailwind CSS Components
- No Naming Things
- Customization tailwind.config.js
- No more switching from HTML to CSS hundreds of times to get a design looking just right; No Context Switching
- Creating Components Is Easy - Extracting Components
- Small Size (after PurgeCSS); Typically as a project grows, your CSS file grows as well. This is not the case when using Tailwind, since you’re using a standardized set of classes.
I don’t know about any full admin templates available, but you can watch Adam Wathan (Tailwind’s creator) build these on his youtube channel which will hopefully provide you with what you need. Also, keep an eye on Tailwind UI, which will likely provide more of what you need. Finally, you might want to check out Awesome Tailwind.
Awesome Tailwind CSS: aniftyco/awesome-tailwindcss