tailwindcss-animate.css
tailwind-safelist-generator
Our great sponsors
tailwindcss-animate.css | tailwind-safelist-generator | |
---|---|---|
2 | 1 | |
129 | 98 | |
- | - | |
4.4 | 0.0 | |
5 months ago | over 1 year ago | |
JavaScript | JavaScript | |
MIT License | MIT License |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
tailwindcss-animate.css
-
Using Animate.css with Tailwind CSS
So, I thought of writing some plugin-like stuff that adds Animate.css animations and the necessary animation utilities to make things easier. There wasn't any specific reason to choose Animate.css over other libraries. It was just a thought that let's start with the most popular one, then add the others later. Firstly I started searching if any similar package exists or not. There is tailwindcss-animatecss but it requires way too much configuration for JIT mode. There wasn't much activity on its repository, so instead of contributing to it, I started working on a package of my own - animated-tailwindcss.
-
Animate.css with Tailwind CSS
The question will probably make you search for some plugin, and the first one on the list will be tailwindcss-animatecss. It is a great plugin in itself, except it requires quite a configuration. Although its adjustable (optional) settings are pretty nice, but setting the variants and required classes seems overkill in the new JIT mode.
tailwind-safelist-generator
-
using purge with custom components
Tailwind safelist generator is one option
What are some alternatives?
nightwind - An automatic, customisable, overridable Tailwind dark mode plugin
twin.macro - 🦹♂️ Twin blends the magic of Tailwind with the flexibility of css-in-js (emotion, styled-components, solid-styled-components, stitches and goober) at build time.
animated-tailwindcss - A configuration to use Animate.css with Tailwind CSS.
kutty - Kutty is a tailwind plugin for building web applications. It has a set of accessible and reusable components that are commonly used in web applications.
alpine-intersect-animate - An Alpine.js plugin to animate DOM once it shows up on the viewport
Tailwind CSS - A utility-first CSS framework for rapid UI development.
tailwindcss-debug-screens - A Tailwind CSS component that shows the currently active screen (responsive breakpoint).
easings.net - Easing Functions Cheat Sheet
tailwindcss-no-scrollbar - This plugin exposes a class that hides the browser's default scrollbar using various tricks.