I would recommend tailwind. Currently, tailwind is pushing best practises and I think they are best to stick with. Bootstrap is loved by some companies, but nowadays I find it pretty clunky. Sass on the other hand is more of an extension for css, to be honest, I fail to find pros of using it. I guess it could work for bigger and highly customizable styling system, but downsides of it like being unable to change it in runtime and need for it being compiled kills development velocity. When I need to do something really wacky and dynamic in CSS, I'll always prefer to use JS/TS for it and also with incoming things like Houdini, I think that's more future proof solution.

Hi Aadam,

So, if you want a straightforward response I'd suggest you to start your learnings with Bootstrap and Sass, but I leave bellow some more reasoning you should be aware of. :)

So, all of them, Bootstrap, Tailwind, Semantic UI and Milligram are solid, well stablished and coherent frontend frameworks, so I'd advise you to choose the one you like the most regarding the look and feel. I'm also adding Semantic UI and Milligram to your list. Keep in mind that the most you know the better will be. :) Plus, when you grasp one, I assure you the next will be way smoother to learn, once you'll have grasped the underlying concepts of frontend element positioning and wireframing, as well as basic component behaviour (like an accordeon, tab selection, complex menu items, etc). Just one FYI, Sass doesn't compare to Bootstrap, Tailwind or Semantic UI. Sass is a, in my opinion, better way to write CSS once you'll do it like your HTML structure, which at the end of the day is more readable.

Bootstrap by all means it's the most used frontend framework worldwide, so if your purpose on learning is to apply for a job, it's more likely to find open positions to work with Bootstrap than any other. Bootstrap, afaik, was the pioneer frontend framework and pretty much all of the others has "borrowed" one or another thing from Bootstrap.

In my opinion, the most difficult thing on all of those frameworks is customization and layouting (the Grid of those systems), so when a designer gives you a Figma (or other wireframing tool) mock so you can reproduce - and that's why you'll need Sass (or pure CSS if you want) to apply some stylesheet rules over the frameworks components (please do this with caution and try as hard as you can not to) - that's where you'll struggle the most, hence the importance of have a good understanding of those frameworks catalogs.

Another thing to keep in mind, this frameworks are not mutually exclusive. This means you can use more than one. For instance, I've seen frontend developers that prefer Bootstrap's Grid System, but like Semantic UI's components more.

So, I think with that you can have a better big picture of those frameworks. :)

Good learning! :D