tailwind css

Tailwind.css is a modern CSS styling framework built for minimal CSS file size, fast frontend development using small CSS classes, and increasing team productivity by minimizing the need to edit CSS classes.

Tailwind vs boostrap

If you know bootstrap you know how to style the properties of html elements using clever css classes. Tailwind.css goes much further, it allows you to fully code the website with responsiveness and events using only CSS classes.

Why is it so fast?

For two reasons. The first is to minimize the amount of css code. Tailwind generates only the necessary classes used in the page's code using npm. The second is to focus the entire styling process on the HTML file and adding subsequent classes to the class attribute. After a brief introduction to tailwind, you no longer want to code in another framework.

Is it hard to learn?

Nope. All beginners can code in tailwind.css after a week of practice. Tailwind is very simple and intuitive, you just enter what you want a given element to look like in the class attribute and that's it.

So what about repeating elements?

If you have repeating elements, such as blocks, buttons or similar elements, you can, as with the traditional approach, declare their styles in the tailwind configuration file using @apply directives. Just remember to keep the classes short and clear, otherwise your css will start to bloat and your site will slow down.