DEV Community

Folarin Lawal
Folarin Lawal

Posted on

Start Using TailwindCSS Now!

Why you should start using TailwindCSS


If you're a web developer, then you've probably heard of Tailwind CSS. It's a utility-based CSS framework that uses Atomic CSS principles to allow developers to quickly create and modify websites. But is it worth learning another new system for building websites? In this article, I'll explain what TailwindCSS is and why it's worth the time investment.

- It's easy to customize

TailwindCSS is a utility-first CSS framework that allows you to easily customize your styles. You can use it with any framework, website, or project. It’s also easy to learn and understand because of its simple syntax and structure.

This makes TailwindCSS a great choice for beginners who don’t have a lot of experience with CSS frameworks (or even front-end development in general) but want to start using one; veterans will appreciate its familiar syntax and the ease with which they can get started.

- Your CSS file size will probably be smaller than Bootstrap's

The second reason why you should use TailwindCSS is because it's smaller than Bootstrap. With Bootstrap, you have to include all of their JS files, default HTML templates, and CSS styles. The total size of this can be over 6MB!

Now compare that with TailwindCSS: you only need to include a single file (the css/tailwind.min.css file) which weighs in at just 1KB! It contains all the necessary styles for your entire website without any extra bloat from other components or unnecessary features. This makes your page load faster than using Bootstrap or other frameworks such as Foundation & Semantic UI because there is less data being downloaded by the browser — which means more time spent building beautiful things instead of waiting for pages to load!

- Class names are readable

With TailwindCSS, your class names are short, descriptive and easy to read. They're also easy to remember.

TailwindCSS makes writing CSS so much easier because it's made up of simple variables that you can use throughout your project. It's very user friendly and has a lot of features like Autoprefixer (which automatically adds vendor prefixes for CSS properties), grid system, animations and much more!

The best part about using this framework is the fact that you don't have to write any new CSS classes in order for them to work with each other - they just do!

It's easier to customize and more efficient than Bootstrap

TailwindCSS is a utility-first CSS framework that allows you to easily create your own custom styles. It's also smaller than Bootstrap, and more efficient at handling big projects like large websites or apps that need consistency in their design.

The biggest advantage of TailwindCSS is its simplicity. The framework was designed with the idea that developers should be able to create their own components without having to look through hundreds of lines of code. Because the core components are well-written and open source, they're easy to modify and customize—you don't have to reinvent the wheel every time you want something new!


So yeah, this is why you should start using TailwindCSS. It's a great tool that speeds up your development and makes it easier for you to manage styles in your application. If this sounds like something you want to learn more about, then sign up for the free online course below. And as always, let me know if there are any questions or concerns in the comments section below!

Discussion (1)

andrewbaisden profile image
Andrew Baisden

Tailwind CSS surpassed Bootstrap a long time ago as far as i'm concerned. In my opinion if you are not planning to write vanilla CSS often then the best CSS framework to learn is Tailwind CSS.