Switching to UnoCSS

1

Tailwind CSS

As you can see from the above code, we have separate css for each value of padding. So instead of defining css manually Everytime, you can simply define these helper css or use an existing css utility framework. I've been Working with a lot of such utitlity frameworks, and people have their own utilty css'. Some of the famous css utility Frameworks are Tailwind Css, Windi Css and Tachyons Etc. So basically these utility frameworks will have a list of helper classes which provide basic css functionalities.

#Developer Tools #Design Tools #Website Design 868 social mentions

2

Tachyons

As you can see from the above code, we have separate css for each value of padding. So instead of defining css manually Everytime, you can simply define these helper css or use an existing css utility framework. I've been Working with a lot of such utitlity frameworks, and people have their own utilty css'. Some of the famous css utility Frameworks are Tailwind Css, Windi Css and Tachyons Etc. So basically these utility frameworks will have a list of helper classes which provide basic css functionalities.

#CSS Framework #Design Tools #Developer Tools 23 social mentions

3

UnoCSS

UnoCSS unlike other css frameworks is a css engine without any utility css of it's own, rather it uses different css framework's Presets. They generally work with build tools and after mentioning the preset you like you can use that framework's classes In your projects right away. Guess what, you can give any number of presets or write your own preset and use it with UnoCSS. And like Windi CSS they use the on demand way of generating css. I am using next js in this website so the build tool used In next is webpack, also I was using tailwind with postcss previously, so the migration looks something like this,.

#Application And Data #Languages & Frameworks #CSS Pre-processors / Extensions 18 social mentions