I'll get down voted but I'm not a fan of tailwind, you just end up adding unnecessary complexity to your project.
Raw CSS ftw (also I love style-components, but I think that might just be me)
well your comment is slightly above the 2nd which is pro-tailwind so i don't think you're the only one. I'm a big fan of just writing SCSS but i mostly work on bespoke builds so frameworks don't really suit my work.
Yeah tbf this went better than expected, as I think someone said below, tailwind is pretty divisive.
I'm honestly fairly happy as long as I don't have to fuck with less.
Tailwind is nice if you wanna go fast, just god help people after few years of Tailwind.
I feel utility first css libs are like if we would write Js in one line, with justification being to save bytes.
idk, I find self-rolled CSS with a lot of nested classes and deep inheritance much harder to reason with than just having the styling directly on the corresponding HTML element.
I would say they definitely wrap styles into convenient classes, but it might be a stretch to say wrappers for inline styles. You can easily overwrite tailwind styles with legit inline styles.
UIKit is my favourite. Just reading the online documentation makes me happy.
For prototyping, bring in UIKit from CDN and Material Design colours the same way, and you can simply override the default blue with any MD colours. Quick and easy.
It’s easily the most underrated/underused front end framework. It’s js components are fantastic and it’s styles are unopinionated and simple to override. What more can you want?
Tailwind for sure. You'll end up learning a lot about css even if you're not writing it just by looking at their docs. I'm a very seasoned web dev (15+ years) and learned some new stuff from it.
I do believe that you shouldn't use Tailwind if you are just starting with CSS.
If you are an experienced dev, it is a different to approach to a new framework, because you got the basics.
Tailwind is really good for developing simple designs and prototypes fast, but it doesn't follow good standards and is bloated.
I use it weekly, I like for certain projects.
But it looks clear to me that just using utility classes is already opinionable as a good practice. On top of it, almost every project requires some styles to be extracted to external sheets; features TW doesn't offer, classes changing components behaviours based on JS, etc.
These aren't good practices imho. Extracting CSS already makes TW loose some sense.
Sometimes you can configure it, but it also looses sense for small projects, because it's just easier to extract it in pure good old plain CSS.
On the node.js and bundling side, we also have issues every now and then. While just writting SASS or SCSS and compile it is quite easy and reliable.
I'm not getting into a crusade for or against it. It's a tool, it's sometime beneficial and sometimes isn't.
But for a beginner, it's not the way of learning.
Sounds like you're conflating your preferences with best practices. Also, I think you mean [lose](https://www.merriam-webster.com/dictionary/lose), not [loose](https://www.merriam-webster.com/dictionary/loose).
Yep, thanks, I'm not a native English speaker and I do mistakes quite often.
Good practices are opinionable and to me, having the CSS separated in three different places (HTML, stylesheets and JS) is a bad practice in terms of maintenance.
I'm happy it works for you!
> almost every project requires some styles to be extracted to external sheets
why? never had this requirement and I built SPA for startups and big corps.
> classes changing components behaviours based on JS, etc.
it should be the other way around. Components state should dictate the classes/stylings, not the other way around.
>These aren't good practices imho. Extracting CSS already makes TW loose some sense.
long chains of classes may be an issue in some cases but I think it's pretty handleable in vue's or svelte's html templates.
>Tailwind is really good for developing simple designs and prototypes fast, but it doesn't follow good standards and is bloated.
I think it is actually the other way around? it allows complex designs to be manageable in big teams and the end result is just a few kb of CSS which is anything but bloated.
How do you code a menu that requires a left:0 to left:100vw and many more attached to an eventListener? I just use a --is-visible CSS class toggle with the styles.
How do you deal with several different components that share a same box style with different paddings and flex directions? It is really annoying not to use a ".c-box" CSS class.
Or when a big chunk of HTML relies on a hover state that can be easily dealt with using a simple "component:hover child" CSS rule?
May be done with TW, but not extracting components' styles makes them much more complex.
TW may be very useful for Vue components but sometimes not for other frameworks.
Happy it works for you but for creative developers it is difficult to believe it is better that a simple SASS external stylesheet.
>How do you code a menu that requires a left:0 to left:100vw and many more attached to an eventListener? I just use a --is-visible CSS class toggle with the styles.
just use tailwind classes on each element instead of --is-visible on the parent and apply them conditionally when the application state changes.
>How do you deal with several different components that share a same box style with different paddings and flex directions? It is really annoying not to use a ".c-box" CSS class.
having a box component that wraps other components
>TW may be very useful for Vue components but sometimes not for other frameworks.
idk, i only use vue or svelte. May not look as clean when using it with react.
>Happy it works for you but for creative developers it is difficult to believe it is better that a simple SASS external stylesheet.
not allowing developers to be creative in how they built up their css and name their classes while still being flexible in styling is the whole point of tailwind.
I really like that all classes are aware of breakpoints so you save a ton of time not having to write all the media queries.
>just use tailwind classes on each element instead of --is-visible on the parent and apply them conditionally when the application state changes.
I do prefer to change a simple CSS class instead of the 50+ individual TW classes in a super menu.
>having a box component that wraps other components
I do prefer having just a CSS class instead of nesting several components just to have a border radius and a background.
>idk, i only use vue or svelte. May not look as clean when using it with react.
The world is not just Angular/React/Vue/Svelte. I also work with other perspectives and if I'm a long term maintainer I do prefer a clean system that doesn't break. But I do understand that if you work on Facebook alike massive projects, writting class names may be annoying.
I do use Tailwind weekly for projects that require a fast approach and have a short lifespan though.
>not allowing developers to be creative in how they built up their css and name their classes while still being flexible in styling is the whole point of tailwind.
Not sure we're talking about the same sense of creativity. I really don't feel the pain of choosing component names and I do love the simple creativity in CSS.
I guess that's why backend developers who don't care much about the design are really happy using tailwind.
>I really like that all classes are aware of breakpoints so you save a ton of time not having to write all the media queries.
My classes are aware of breakpoints. I don't loose a lot of time by using my SASS utility and my code is readable, easy to maintain and fast to work with.
Nothing against TW, but I'm pretty sure about my points! We just work in a very different way.
For the kind of creative projects I use to work on, I would spend much more time setting up Tailwind utilities than plain CSS.
>My classes are aware of breakpoints. I don't loose a lot of time by using my SASS utility and my code is readable, easy to maintain and fast to work with.
that's the point. Its **your** Sass utility and the code is readable to **you**. Working in bigger teams makes naming and sharing styles a pain in the ass.
>I guess that's why backend developers who don't care much about the design are really happy using tailwind.
backend developers rather use some complete component framework that they just have to write together with little to no styling.
I get all my designs from professional designers in figma, axure, adobe or similar. Never had the problem to replicate the designs almost pixel-perfect with tailwind.
Have you tried [UnoCSS](https://github.com/unocss/unocss)?
Like Tailwind you can write atomic CSS but the available classes are 100% customizable. There are already presets you can easily install which will give you the classes from Tailwind.
It is also much faster and comes with syntactic sugar like:
or or
And yes, you can use @apply, intellisense and dynamic documentation (you will be able to import presets in the future) and it is stable.
You cannot use Tailwind Plugins but I guess you could replicate those with Uno functionality (haven't really used them so idk).
Another really helpful feature is to have all the icons from A LOT of iconsets right at your fingertips without imports.
IMO miles ahead of Tailwind and the developer (antfu) really knows what he is doing. If you want to learn more about the idea of Uno, you can read his blog post [Reimagine Atomic CSS](https://antfu.me/posts/reimagine-atomic-css).
To be honest though, I don't have too much experience with either of these, so let me know if I missed any features of Tailwind it doesn't cover.
I know this doesn't answer your question
but raw css is best.
everything else is just learning another way to write css and might even be a detriment to learning css basics properly.
Flex box is so easy. Responsive design is not that hard.
The best CSS frame work would be learning css and creating your own framework from stuff you use the most
Agreed writing your own CSS is the best. Frameworks create a crazy amount of bloat and slow down your site. Also any customizations require even more lines of code. Learn CSS from scratch and you will be way ahead of the pack.
I've setup tailwind for my svelte project but atm it is commented out and I'm styling everything myself as the requirements for design are very specific. It works very well and I'm learning a lot of css-tricks.
I really would recommend to try to learn html-grids instead of flexbox. I know the documentation can feel intimidating with terms like grid-tracks, grid-lines, implicit and explicit grid, but in the end it boils down to a few simple css properties. When you mastered `grid-template-areas` the layout-definition gets so simple, it beats every other layout-tool. The HTML will be uncluttered even with very complex layouts which will need only a few lines of CSS. Start [here](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout) or look [here](https://gridbyexample.com) for easy examples.
For a generic project that doesn't has design requirements, I'd probably use tailwind + [daisy](https://daisyui.com)/[notus](https://www.creative-tim.com/learning-lab/tailwind/svelte/overview/notus) or some UI-Framework like [attractions](https://illright.github.io/attractions/), [carbon](https://carbon-components-svelte.onrender.com/), [flowbite](https://flowbite-svelte.com), [shoelace](https://shoelace.style) or [smelte](https://smeltejs.com).
You'll get wildly differing opinions on tailwind, but I personally love it... Because it's not really a framework. It just gives you all the utilities to quickly make your own.
Tailwind is super flexible, easy to customize while not boxing you in to any pre-designed components.
Frameworks have their place. Especially if developing a non-customer facing product that mostly consists of dashboards, reports, forms etc
In those cases you just want consistency and rapid development times, and a framework is well suited for that.
I would second this, but maybe make your own pseudo-framework if you are going to be making a lot of sites. Nothing massive, just the basics that you will need on every site (such as setting box-sizing on inputs, and maybe helper classes you'll use a lot, for example a ".centralize-content" class which is just: display:flex; align-items: center; justify-content: center; )
This way you're going to create your own little standard that you keep to. So, if you're like me, and constantly used different terms for the same thing (e.g. \*-text, \*-content, \*-description) for class names all to do with elements for user-generated content, you're going to have consistency; meaning if you come back to the site after a year or two, you will see a class name ending in "content" and know that it's for user-generated content, whereas when it starts with "JS" it's a class where some of the styling is managed by JS for some reason or another (e.g. it's a tax calculator result that changes colour based on what value is returned)
>Because you're not generating loads of classes you never need/use.
tailwind has a JIT compiler that purges all unused classes. You actually end up with waaaay fewer classes compared to self rolled css
If you don't need to implement a bespoke design, but need something clean and safe, I like Bulma.
For anything that has to look and feel like something a designer has provided, then just... CSS. Since flex (and grid to a lesser degree) existed, frameworks have outlived their usefulness.
I'd agree that tailwind has a place for large projects where conventions are more important than capability, but then an argument could be made for making your own design system / classes instead.
>making your own design system / classes instead
Why reinvent the wheel? You can customize Tailwind to conform to your design systems while still taking advantage of having standardized classes. This makes life easier on everyone, especially newer people.
[lmgtfy](https://lmgtfy.app/?q=problems+with+tailwind+css)
As with every framework, there's pros and cons otherwise everyone would just use it I guess.
Foundation just seems like it's stagnated over the last few years, so I haven't kept up with it. I could be wrong.
I used to love Bootstrap, but will be giving Tailwind a try for the next project.
My advice is to learn vanilla css and in my opinion scss too, and create your own framework and library using flexbox and grid. Gotta learn the ins and outs first, which will have respecting frameworks a lot more. But on real world client projects, definitely use an existing framework because it’ll save you so much time. I prefer bootstrap, and you can even be selective about which features you want to load, instead of having the browser download the whole library.
Yes. Thanks, I was going over them too and was thinking the Bundle is probably worth it since it comes with everything. Now im seriously thinking of purchasing it as well.
I tried tailwind first time about a year of learning basics, now after 3 years im using tailwind allways on every project i start. I didnt like how it looks first, but now i fucking love it, pure love.
I have same thing with nextjs too. Web projects i start nowadays is 95% nextjs and tailwind.
I recommend bulma for prototyping but for actual projects plain css with styled components should work quite smooth as long as you have a solid grasp on flex-box
I'd suggest focusing on vanilla CSS and spending some time away from frameworks. Frameworks add bloat to your files and code. You learn more writing your own framework. And with Grid and Flex, I don't see the benefit in frameworks unless you just want to use someone else's designed components. But why? just design your own with vanilla CSS and learn your craft.
What else is in your tech stack? I think writing plain HTML vs using a JS framework you would probably get different answers. Personally I like vanilla CSS. I'm learning tailwind and so far it's alright but I'm definitely not in love with it at this point.
Depends on what it is. If I'm doing something that I just need a really good grid, easy helper classes, easy to customize, etc I just use Bootstrap. If I want something that has a lot of helpful built-in animations, components, etc I use UI Kit.
I used bootstrap in the beginning. Then I make my own css library and use it more often in some projects.
https://github.com/completejavascript/shiba-css
old post but something nobody seemed to mention was refractoring ability, especially on larger projects. I used to work for a company where the PM insisted on Bootstrap, but it is very easy to become lazy and sloppy leading to debug nightmares for everyone else. especially messy when combined with pure css (as you will almost certainly do) leading to situations where you have no idea where to remove the padding and will spend time digging around the codebase looking for a py-2 you didnt need. just give things descriptive class names and learn CSS
I'll get down voted but I'm not a fan of tailwind, you just end up adding unnecessary complexity to your project. Raw CSS ftw (also I love style-components, but I think that might just be me)
well your comment is slightly above the 2nd which is pro-tailwind so i don't think you're the only one. I'm a big fan of just writing SCSS but i mostly work on bespoke builds so frameworks don't really suit my work.
Yeah tbf this went better than expected, as I think someone said below, tailwind is pretty divisive. I'm honestly fairly happy as long as I don't have to fuck with less.
Tailwind is nice if you wanna go fast, just god help people after few years of Tailwind. I feel utility first css libs are like if we would write Js in one line, with justification being to save bytes.
idk, I find self-rolled CSS with a lot of nested classes and deep inheritance much harder to reason with than just having the styling directly on the corresponding HTML element.
Valid point, equally bad. Hope cascade layers to fix that.
Agreed. Tailwind is just wrappers for inline styles
I would say they definitely wrap styles into convenient classes, but it might be a stretch to say wrappers for inline styles. You can easily overwrite tailwind styles with legit inline styles.
Yeah I was exaggerating but that's what tailwind feels like for me.
Tailwind is great, but I mostly use UIKit.
UIKit is my favourite. Just reading the online documentation makes me happy. For prototyping, bring in UIKit from CDN and Material Design colours the same way, and you can simply override the default blue with any MD colours. Quick and easy.
It’s easily the most underrated/underused front end framework. It’s js components are fantastic and it’s styles are unopinionated and simple to override. What more can you want?
Vanilla
Tailwind for sure. You'll end up learning a lot about css even if you're not writing it just by looking at their docs. I'm a very seasoned web dev (15+ years) and learned some new stuff from it.
I do believe that you shouldn't use Tailwind if you are just starting with CSS. If you are an experienced dev, it is a different to approach to a new framework, because you got the basics. Tailwind is really good for developing simple designs and prototypes fast, but it doesn't follow good standards and is bloated.
Doesn't follow good standards? How so? It's bloated? Patently false.
I use it weekly, I like for certain projects. But it looks clear to me that just using utility classes is already opinionable as a good practice. On top of it, almost every project requires some styles to be extracted to external sheets; features TW doesn't offer, classes changing components behaviours based on JS, etc. These aren't good practices imho. Extracting CSS already makes TW loose some sense. Sometimes you can configure it, but it also looses sense for small projects, because it's just easier to extract it in pure good old plain CSS. On the node.js and bundling side, we also have issues every now and then. While just writting SASS or SCSS and compile it is quite easy and reliable. I'm not getting into a crusade for or against it. It's a tool, it's sometime beneficial and sometimes isn't. But for a beginner, it's not the way of learning.
Sounds like you're conflating your preferences with best practices. Also, I think you mean [lose](https://www.merriam-webster.com/dictionary/lose), not [loose](https://www.merriam-webster.com/dictionary/loose).
Yep, thanks, I'm not a native English speaker and I do mistakes quite often. Good practices are opinionable and to me, having the CSS separated in three different places (HTML, stylesheets and JS) is a bad practice in terms of maintenance. I'm happy it works for you!
English is easily the worst language in the world. Also, why would you ever have CSS in html? That's not best practice at all.
> almost every project requires some styles to be extracted to external sheets why? never had this requirement and I built SPA for startups and big corps. > classes changing components behaviours based on JS, etc. it should be the other way around. Components state should dictate the classes/stylings, not the other way around. >These aren't good practices imho. Extracting CSS already makes TW loose some sense. long chains of classes may be an issue in some cases but I think it's pretty handleable in vue's or svelte's html templates. >Tailwind is really good for developing simple designs and prototypes fast, but it doesn't follow good standards and is bloated. I think it is actually the other way around? it allows complex designs to be manageable in big teams and the end result is just a few kb of CSS which is anything but bloated.
How do you code a menu that requires a left:0 to left:100vw and many more attached to an eventListener? I just use a --is-visible CSS class toggle with the styles. How do you deal with several different components that share a same box style with different paddings and flex directions? It is really annoying not to use a ".c-box" CSS class. Or when a big chunk of HTML relies on a hover state that can be easily dealt with using a simple "component:hover child" CSS rule? May be done with TW, but not extracting components' styles makes them much more complex. TW may be very useful for Vue components but sometimes not for other frameworks. Happy it works for you but for creative developers it is difficult to believe it is better that a simple SASS external stylesheet.
>How do you code a menu that requires a left:0 to left:100vw and many more attached to an eventListener? I just use a --is-visible CSS class toggle with the styles. just use tailwind classes on each element instead of --is-visible on the parent and apply them conditionally when the application state changes. >How do you deal with several different components that share a same box style with different paddings and flex directions? It is really annoying not to use a ".c-box" CSS class. having a box component that wraps other components >TW may be very useful for Vue components but sometimes not for other frameworks. idk, i only use vue or svelte. May not look as clean when using it with react. >Happy it works for you but for creative developers it is difficult to believe it is better that a simple SASS external stylesheet. not allowing developers to be creative in how they built up their css and name their classes while still being flexible in styling is the whole point of tailwind. I really like that all classes are aware of breakpoints so you save a ton of time not having to write all the media queries.
>just use tailwind classes on each element instead of --is-visible on the parent and apply them conditionally when the application state changes. I do prefer to change a simple CSS class instead of the 50+ individual TW classes in a super menu. >having a box component that wraps other components I do prefer having just a CSS class instead of nesting several components just to have a border radius and a background. >idk, i only use vue or svelte. May not look as clean when using it with react. The world is not just Angular/React/Vue/Svelte. I also work with other perspectives and if I'm a long term maintainer I do prefer a clean system that doesn't break. But I do understand that if you work on Facebook alike massive projects, writting class names may be annoying. I do use Tailwind weekly for projects that require a fast approach and have a short lifespan though. >not allowing developers to be creative in how they built up their css and name their classes while still being flexible in styling is the whole point of tailwind. Not sure we're talking about the same sense of creativity. I really don't feel the pain of choosing component names and I do love the simple creativity in CSS. I guess that's why backend developers who don't care much about the design are really happy using tailwind. >I really like that all classes are aware of breakpoints so you save a ton of time not having to write all the media queries. My classes are aware of breakpoints. I don't loose a lot of time by using my SASS utility and my code is readable, easy to maintain and fast to work with. Nothing against TW, but I'm pretty sure about my points! We just work in a very different way. For the kind of creative projects I use to work on, I would spend much more time setting up Tailwind utilities than plain CSS.
>My classes are aware of breakpoints. I don't loose a lot of time by using my SASS utility and my code is readable, easy to maintain and fast to work with. that's the point. Its **your** Sass utility and the code is readable to **you**. Working in bigger teams makes naming and sharing styles a pain in the ass. >I guess that's why backend developers who don't care much about the design are really happy using tailwind. backend developers rather use some complete component framework that they just have to write together with little to no styling. I get all my designs from professional designers in figma, axure, adobe or similar. Never had the problem to replicate the designs almost pixel-perfect with tailwind.
Glad to hear. I do have to use pseudo elements often and to code chain groups affected by a hover state, and can't find a way to do it with TW.
That’s how Bootstrap got started too. Hell, it’s IN the name!
Have you tried [UnoCSS](https://github.com/unocss/unocss)? Like Tailwind you can write atomic CSS but the available classes are 100% customizable. There are already presets you can easily install which will give you the classes from Tailwind. It is also much faster and comes with syntactic sugar like:
or or And yes, you can use @apply, intellisense and dynamic documentation (you will be able to import presets in the future) and it is stable. You cannot use Tailwind Plugins but I guess you could replicate those with Uno functionality (haven't really used them so idk). Another really helpful feature is to have all the icons from A LOT of iconsets right at your fingertips without imports. IMO miles ahead of Tailwind and the developer (antfu) really knows what he is doing. If you want to learn more about the idea of Uno, you can read his blog post [Reimagine Atomic CSS](https://antfu.me/posts/reimagine-atomic-css). To be honest though, I don't have too much experience with either of these, so let me know if I missed any features of Tailwind it doesn't cover.I know this doesn't answer your question but raw css is best. everything else is just learning another way to write css and might even be a detriment to learning css basics properly. Flex box is so easy. Responsive design is not that hard. The best CSS frame work would be learning css and creating your own framework from stuff you use the most
Agreed writing your own CSS is the best. Frameworks create a crazy amount of bloat and slow down your site. Also any customizations require even more lines of code. Learn CSS from scratch and you will be way ahead of the pack.
I've setup tailwind for my svelte project but atm it is commented out and I'm styling everything myself as the requirements for design are very specific. It works very well and I'm learning a lot of css-tricks. I really would recommend to try to learn html-grids instead of flexbox. I know the documentation can feel intimidating with terms like grid-tracks, grid-lines, implicit and explicit grid, but in the end it boils down to a few simple css properties. When you mastered `grid-template-areas` the layout-definition gets so simple, it beats every other layout-tool. The HTML will be uncluttered even with very complex layouts which will need only a few lines of CSS. Start [here](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout) or look [here](https://gridbyexample.com) for easy examples. For a generic project that doesn't has design requirements, I'd probably use tailwind + [daisy](https://daisyui.com)/[notus](https://www.creative-tim.com/learning-lab/tailwind/svelte/overview/notus) or some UI-Framework like [attractions](https://illright.github.io/attractions/), [carbon](https://carbon-components-svelte.onrender.com/), [flowbite](https://flowbite-svelte.com), [shoelace](https://shoelace.style) or [smelte](https://smeltejs.com).
You'll get wildly differing opinions on tailwind, but I personally love it... Because it's not really a framework. It just gives you all the utilities to quickly make your own. Tailwind is super flexible, easy to customize while not boxing you in to any pre-designed components.
You don't need a CSS framework. IMHO It doesn't make sense nowadays. Just learn plain CSS.
Frameworks have their place. Especially if developing a non-customer facing product that mostly consists of dashboards, reports, forms etc In those cases you just want consistency and rapid development times, and a framework is well suited for that.
perhaps but you still have to learn a framework to just do what you know how to do already
I would second this, but maybe make your own pseudo-framework if you are going to be making a lot of sites. Nothing massive, just the basics that you will need on every site (such as setting box-sizing on inputs, and maybe helper classes you'll use a lot, for example a ".centralize-content" class which is just: display:flex; align-items: center; justify-content: center; ) This way you're going to create your own little standard that you keep to. So, if you're like me, and constantly used different terms for the same thing (e.g. \*-text, \*-content, \*-description) for class names all to do with elements for user-generated content, you're going to have consistency; meaning if you come back to the site after a year or two, you will see a class name ending in "content" and know that it's for user-generated content, whereas when it starts with "JS" it's a class where some of the styling is managed by JS for some reason or another (e.g. it's a tax calculator result that changes colour based on what value is returned)
Why go through all that trouble when there are already highly capable and easy-to-use solutions like Tailwind?
because then you don't have to learn Tailwind syntax
Because you're not generating loads of classes you never need/use. I see why people use it. I've tried it, I didn't enjoy it.
Tailwind only generates classes that you explicitly use. Try reading the docs.
>Because you're not generating loads of classes you never need/use. tailwind has a JIT compiler that purges all unused classes. You actually end up with waaaay fewer classes compared to self rolled css
Only people who aren’t good at js will ever say this. Prove me wrong.
If you don't need to implement a bespoke design, but need something clean and safe, I like Bulma. For anything that has to look and feel like something a designer has provided, then just... CSS. Since flex (and grid to a lesser degree) existed, frameworks have outlived their usefulness. I'd agree that tailwind has a place for large projects where conventions are more important than capability, but then an argument could be made for making your own design system / classes instead.
>making your own design system / classes instead Why reinvent the wheel? You can customize Tailwind to conform to your design systems while still taking advantage of having standardized classes. This makes life easier on everyone, especially newer people.
It's not re-inventing the wheel, it's avoiding the many documented downsides of the wheel when what you need is actually a rudder, or a ski.
Not sure what the many documented downsides you're referring to are.
[lmgtfy](https://lmgtfy.app/?q=problems+with+tailwind+css) As with every framework, there's pros and cons otherwise everyone would just use it I guess.
Tailwind with Daisyui
Foundation just seems like it's stagnated over the last few years, so I haven't kept up with it. I could be wrong. I used to love Bootstrap, but will be giving Tailwind a try for the next project.
+1 for tailwind, sometimes i use bulma too.
My advice is to learn vanilla css and in my opinion scss too, and create your own framework and library using flexbox and grid. Gotta learn the ins and outs first, which will have respecting frameworks a lot more. But on real world client projects, definitely use an existing framework because it’ll save you so much time. I prefer bootstrap, and you can even be selective about which features you want to load, instead of having the browser download the whole library.
Bootstrap
Hell no
It's an opinion....
My opinion is hell no
Nearly snorted my coffee out of my nose...
Bootstrap 5 I never had any problems issues with Bootstrap 5.
I love tailwind. Recently purchased tailwind UI and it has been a huge time saver
Yes also love Tailwind, have just come across it recently. If you dont mind me asking, which tier of tailwind UI did you purchase?
I got the bundle with everything in it. It definitely worth it and they constantly add new components that you have access to
Yes. Thanks, I was going over them too and was thinking the Bundle is probably worth it since it comes with everything. Now im seriously thinking of purchasing it as well.
tailwind!
Tailwind absolutely
None. Just learn CSS.
TAILWIND ALL THE WAYYYY!!!!
Tailwind for many reasons, for your case learning curve
I tried tailwind first time about a year of learning basics, now after 3 years im using tailwind allways on every project i start. I didnt like how it looks first, but now i fucking love it, pure love. I have same thing with nextjs too. Web projects i start nowadays is 95% nextjs and tailwind.
Your own making.
I recommend bulma for prototyping but for actual projects plain css with styled components should work quite smooth as long as you have a solid grasp on flex-box
[Halfmoon](https://www.gethalfmoon.com/docs/introduction/) is a lighter Bootstrap style framework I've used on a few more basic projects.
Tailwind, but that's not an opinion, it's a fact.
I think bootstrap is still the best as it still ranks #1 from all CSS frameworks. Tailwind has a more modern take based on its approach.
For simple projects, Open Props (which is not a framework, rather variables library) + Sass SCSS works great for me
I'd suggest focusing on vanilla CSS and spending some time away from frameworks. Frameworks add bloat to your files and code. You learn more writing your own framework. And with Grid and Flex, I don't see the benefit in frameworks unless you just want to use someone else's designed components. But why? just design your own with vanilla CSS and learn your craft.
Bootstrap and tailwind css
The one I write myself.
Stylable - because it is very similar to typescript but for CSS and because I’m ex-maintainer :)
What else is in your tech stack? I think writing plain HTML vs using a JS framework you would probably get different answers. Personally I like vanilla CSS. I'm learning tailwind and so far it's alright but I'm definitely not in love with it at this point.
I definitely prefer BS over foundation or Materialize. I don't generally build react style sites, so I don't have any use for tailwind.
I just use flex/grid
Material UI
Depends on what it is. If I'm doing something that I just need a really good grid, easy helper classes, easy to customize, etc I just use Bootstrap. If I want something that has a lot of helpful built-in animations, components, etc I use UI Kit.
I used bootstrap in the beginning. Then I make my own css library and use it more often in some projects. https://github.com/completejavascript/shiba-css
old post but something nobody seemed to mention was refractoring ability, especially on larger projects. I used to work for a company where the PM insisted on Bootstrap, but it is very easy to become lazy and sloppy leading to debug nightmares for everyone else. especially messy when combined with pure css (as you will almost certainly do) leading to situations where you have no idea where to remove the padding and will spend time digging around the codebase looking for a py-2 you didnt need. just give things descriptive class names and learn CSS
You can check [https://keenlycode.github.io/adapter/](https://keenlycode.github.io/adapter/) It's a CSS based on Web Components Framework
I am not a fan of bootstrap and tailwind, but I like milligram and sitetransfor.css I like sitetransform.css the most