DEV Community

Cover image for Bootstrap vs. Tailwind CSS

Bootstrap vs. Tailwind CSS

Kudzai Murimi on May 23, 2024

Bootstrap vs. Tailwind CSS: What's the Difference? Hello Dev Community! 👋 Welcome to another insightful article where we dive into the ...
Collapse
 
fadekocodeit profile image
Future_Developer

I think both bootstrap and tailwind css are great! It's dependent on what your projects requirements and preferences are, my first project l used bootstrap but l will suggest that it's good to learn both framework.

Collapse
 
biolater profile image
Murad

Yeah but for beginners bootstrap is more suitable at first. Getting used to a css framework is important before moving into tailwind css. That is what i did at least.

Collapse
 
respect17 profile image
Kudzai Murimi

Thanks for sharing the knowledge, I second you on that Murad!

Collapse
 
moopet profile image
Ben Sinclair

Personally I think it'd be better to learn the fundamentals of CSS first rather than an abstraction. In this instance I'd say learn CSS, then Tailwind instead of Bootstrap - it's more modern and it's "closer to the metal".

Full disclosure, I'd also say learn the fundamentals of CSS and don't bother with Tailwind (or any other HTML-based framework) so take what I say with a pinch of salt.

Collapse
 
respect17 profile image
Kudzai Murimi

Yeah, 100% true!
It depends on the project.

Collapse
 
giovapanasiti profile image
Giovanni Panasiti

Great article. I'd like to note that if you try to go a bit further than the basic example bootstrap continues to have a short, readable, and with clear markup while tailwind gets more and more clutter HTML.

I love bootstrap so much that I'm even trying to give it a new kinda of life with ui.bootstrap.ninja

Since the bootstrap ecosystem was really leaking of high quality, production-grade components

Collapse
 
respect17 profile image
Kudzai Murimi

Thank Giovanni, l will release more about Bootstrap soon!

Collapse
 
kwnaidoo profile image
Kevin Naidoo • Edited

You are so right. I am a backend person, I do frontend from time to time. Tailwind is hard to remember if you don't use it often like frontend guys do, I purchased a few templates and the markup was so ugly, that it feels like the tabular layouts with in-line CSS we used in the early web days. Touch one thing and the whole thing breaks.

Tailwind Topography and colors look neat though, and there are some nice component libraries on top of Tailwind like "daisyui" that make it easier to work with.

I still prefer just CSS and Bootstrap :-) uncomplicated(btn-primary, col-md-6 etc...), and I know both well enough to do just about anything I want.

Collapse
 
poetro profile image
Peter Galiba

The Choose Tailwind CSS if section looks to be unfinished.

Collapse
 
respect17 profile image
Kudzai Murimi

Thanks Peter!

Collapse
 
dagnelies profile image
Arnaud Dagnelies

It should be noted that Bootstrap offers utility classes too. See getbootstrap.com/docs/5.3/utilitie... for example. This kind of stuff is not limited to tailwind. ...actually, almost all CSS frameworks have utility classes.

Collapse
 
eshimischi profile image
eshimischi

Check UnoCSS too

Collapse
 
respect17 profile image
Kudzai Murimi

Thanks Eshimischi. Will look into that too!

Collapse
 
mitchiemt11 profile image
Mitchell Mutandah

Great share!

Collapse
 
vishv profile image
Vishv

Great comparison.

Collapse
 
stevensacks profile image
Steven Sacks • Edited
Collapse
 
nenyasha profile image
Melody Mbewe

Great article.

Collapse
 
herohunter001 profile image
Hero Hunter

Tailwind

Collapse
 
lotfijb profile image
Lotfi Jebali

Great post ! thanks for sharing these thoughts

Collapse
 
lindiwe09 profile image
Lindie

Great article!

Collapse
 
at-the-vr profile image
Atharva

TailwindCSS removed purge since 3.0 there's a dedicated section addressing optimization using its own cli and CssNano

Collapse
 
ncarps profile image
Neil

The purge config option might have been removed, but there's still an option to add a 'content' config that does the same job as far as I'm aware.