DEV Community

What are your favourite CSS frameworks so far? πŸ’…

Meat Boy on February 19, 2022

Like in the title. What is your favourite CSS framework or stylesheet? Bootstrap? Bulma? Tailwind? Other?

Collapse
 
fadhilradh profile image
Fadhil Radhian

Tailwind for me

Collapse
 
meatboy profile image
Meat Boy

Why Tailwind? What do you like about it? :)

Collapse
 
fadhilradh profile image
Fadhil Radhian • Edited

The thing that did it for me was the simplicity to understand what's every class usage, since it is usually only for 1 CSS attribute, not multiple packed as one like Bootstrap. Therefore it give us freedom to mix & match almost every Tailwind class available.

If you want a component library and also the easy-to-customize benefit of Tailwind, you can use Tailwind UI, daisyui or tailwindcomponents.com. You get the best of both worlds.

Collapse
 
ben profile image
Ben Halpern

This whole "utility-first" approach is really nice to work with. It doesn't need to be the thing we now use for everything, but it is definitely a step change if you're bought in.

From their home page:

An API for your design system.

Utility classes help you work within the constraints of a system instead of littering your stylesheets with arbitrary values. They make it easy to be consistent with color choices, spacing, typography, shadows, and everything else that makes up a well-engineered design system.

These ideas really do work effectively in my opinion. Tailwind is truly the first framework I've liked at all, in many ways. I see value in Bootstrap for a lot of projects, but the scalable productivity of the utility-first approach is really a big deal, IMO.

Collapse
 
omarpervez profile image
Omar Pervez

Tailwinds css has lots of components. I was using this framework on my project about 1 years. It's good.

Collapse
 
mkamal1990 profile image
Kamal.M

Bootstrap is ultimate

Collapse
 
omarpervez profile image
Omar Pervez

Yes, Bootstrap ☺️

Collapse
 
andreseduardop profile image
andreseduardop

Some advantages that I like about BS:

  • Components included.
  • Fewer Cross browser bugs
  • Supports major of all browsers and CSS compatibility fixes.
Collapse
 
eljayadobe profile image
Eljay-Adobe

So far in the conversation I've seen:

  • Tailwind
  • Bootstrap
  • Zurb Foundation
  • vanilla CSS
  • vanilla CSS kept very simple

I'm in the simple vanilla CSS camp.

A vote against OOCSS/BEM. (Not sure what that is.)

No votes for Bulma.

From lack of mention of SASS, I take it that's not popular anymore...?

Collapse
 
cmborchert profile image
Christopher Borchert

OOCSS and BEM are naming conventions for your components rather than actual frameworks.

Collapse
 
andrewbaisden profile image
Andrew Baisden

Tailwind has become the most popular in my opinion. Bootstrap is pretty good too it was one of the first that I learned.

Collapse
 
iandjx profile image
Ian de Jesus

twin.macro

Collapse
 
evg profile image
Evg • Edited

I try not to use them. I write simple css to maintain the purity and control of the code, including for fairly large projects. I used to study almost all the novelties in this field, and learning means doing something on them. But time passed, I was tired, to be honest. I think I can afford it after more than 20 years of practice. Though... in the last project used the Bootstrap icons. :)

Collapse
 
imagineeeinc profile image
Imagineee

I love doing css by hand, where you have the power over everything, I am looking into learning scss to simplify complex css; But i am also planning on using tailwind at some point with its utility class approach, the only criticism is its long class list that will form.

I am planning on making tool where you write your tailwind classes in a css file and it will be compiled to straight css, like scss for tailwind.

Collapse
 
ivan_jrmc profile image
Ivan Jeremic

Thats already a tailwind feature you can do that today look at @apply

Collapse
 
imagineeeinc profile image
Imagineee

oh never knew that, but the fun of engineering some thing your self that's already on the market is quite fun

Collapse
 
wrench1815 profile image
Hardeep Kumar

Bootstrap, the ease and speed it provides while creating frontend is incomparable (for me atleast), though it can sometimes a bit kinda Glitchy to work wuth(custom stuff) but everything has its flaws. 2nd is Sakura css, a no class css framework, just use html and get a good layout, perfect for prototyping a idea quickly.

Collapse
 
danwalsh profile image
Dan Walsh

Loving TailwindCSS at the moment. πŸ₯°

I picked up the utility-first CSS itch with Bootstrap 4, and after reading "In Defense of Utility-First CSS" and switching to TailwindCSS, I don't think I could ever go back to OOCSS/BEM.

I really enjoy interrogating web designs and identifying repeating patterns for abstraction (whether into components or grouped classes), and TailwindCSS makes that a breeze.

I also really like that while TailwindCSS provides you with the entire kitchen sink, your production CSS is tiny as all of your unused styles are automatically purged.

Collapse
 
louislow profile image
Louis Low

Artis is a low-level and functional virtual CSS library with no CSS codes. More than 80 Utilities. Infinite Configurations. (artisjs.netlify.app) #virtualcss #virtualdom #javascript #cssinjs #csslibrary

Image description

Collapse
 
simonayriss profile image
Simon Ayriss • Edited

fwiw. as with anything -- depends on the requirement.
I've looked at a lot.
Once you work with them you realize more and more they are bloatware.
Tailwind takes the approach, give you everything you could possibly need upfront - then take away what you're not using.
Which is good but what if you want to reverse engineer a large project a year later and scale it. not sure. but it's good for UI or even mobile etc.
Bootstrap is seen it's day but it still has a place. Also too much. but it's a good pick up and go universal starting point. It's almost as if Bootstrap should follow the take away what you don't use approach like Tailwind.
if it's too much code for something simple then sometimes the best thing is to just write your own. codepen.io/simonayriss/pen/qBVYVgL or find something minimal and go from there.

Collapse
 
omarpervez profile image
Omar Pervez

Bootstrap is good for mine😊. And you?

Collapse
 
j45t7 profile image
j45t7

Since I learned about Tailwind I want to use it in every project πŸ™ˆ

Collapse
 
jonaspetri profile image
Jonas Petri

Same!

Collapse
 
jonaspetri profile image
Jonas Petri • Edited

Definitely Tailwind for me! I really like how easy it is to make media queries, and (for me) it’s easier to work with than normal CSS since I don’t have to jump between files. (Yes, sure, you could have the CSS in your HTML in a style tag, but still, with tailwind all the properties are IN the actual element.)
EDIT: Seems like I’m not the only one with that opinion here! Most people here seem to love Tailwind.

Collapse
 
alexisanzieu profile image
Alexis πŸ’«

May depend of the frontend lib and context for me!
React => Chakra or Mui
Vuejs => ElementUI
Mobile => ionic

Collapse
 
machy8 profile image
Vladimír MachÑček

Stylify stylify.dev/ ❀️

Collapse
 
becksafarov profile image
Begzod Safarov

Chakra UI is nice

Collapse
 
amiamigo profile image
Ami Amigo

I will add Amigo CSS on the list. amigocss.com/

Collapse
 
pavelloz profile image
PaweΕ‚ Kowalski

TailwindCSS, but its not really a framework tbh. It has no components built-in, you need to add them.

Collapse
 
swina profile image
Antonio

Depends on the project. There is no an ultimate solution. Developers job is to find the right solution based on the project you are working on. This is technology.

Collapse
 
dev_ade profile image
Adejumo Ahmad

It's surely Tailwind

Collapse
 
pontakornth profile image
Pontakorn Paesaeng

Tailwind/Windi I love being able to do quick prototype and change styles easily.

Collapse
 
neoprint3d profile image
Drew Ronsman

Tailwind easy quick and simple

Collapse
 
boooooo profile image
Hamad

Tailwind

Collapse
 
arshahmad profile image
Arsh Ahmad

tailwind no doubt

Collapse
 
curiousdev profile image
CuriousDev

Is to use a framework in general recommended or can we just use CSS? If you have a favourite one, please explain why!

Collapse
 
lambstream profile image
TheDarkGlobe

For me it's tailwind because once you get used to the naming conventions it makes it very intuitive to design components / pages quickly.

Collapse
 
laurentpayot profile image
Laurent Payot • Edited

Beercss: Material Design in 12kB minzipped CSS, and with lots of features. Less than 7kB in my app after PurgeCSS.

Collapse
 
jitendravyas profile image
Jitendra Vyas

Atomic CSS acss.io for me. I initially hated it but later on I understood how it solves many problems we face when there are multiple developers working on a project.

Collapse
 
inflex1337 profile image
Ethan Pusppa

Tailwind get my vote simplicity at its best.

Collapse
 
arsalannury profile image
ArsalanNury

Material UI with React is good too,
but i usually like both bootstrap and tailwind

Collapse
 
elgeneee profile image
Elgene Ee Ding Ren

Tailwind

Collapse
 
kushiahu profile image
Josue Tamayo

None!

Collapse
 
gi_dev profile image
G_dev

Tailwind css for me. Reasons: Fast development, good experience, small size & plenty of customization options.

Bootstrap is a close second.

Collapse
 
ageekdev profile image
Ξ›GΣΣK

If I was forced to use a CSS framework then I'll pick Tailwind. But not using any CSS frameworks is always my first choice.

Collapse
 
kotofeyweb profile image
Kotofey.web

Vianilla CSS only.

Collapse
 
katojkalemba profile image
Kato James

bootstrap is my best

Collapse
 
devanandukalkar profile image
Devanand Ukalkar

Bootstrap anytime....

Collapse
 
bensengilbert profile image
Bensen

Tailwind for me

Collapse
 
innocentperos profile image
innocentperos

tailwindcss is my weapon of choice ;)

Collapse
 
henningsummer profile image
Henning Summer • Edited

Materialize, bootstrap and bulma are simples! But, Tailwind is more flexible.

Collapse
 
onixhoque profile image
Onix Hoque

Someone please mention Semantic UI!!

Collapse
 
stevetenas profile image
STEVE TENADJANG

Tailwind CSS

Collapse
 
sbegh profile image
sbeghen-laurent

Hi, i use Zurb Foundation 6, Bootstrap 4/5 most offen.