Best CSS frameworks

What should you study after HTML and CSS? Try CSS frameworks!

A CSS framework is a library with predefined classes that help you design web-sites and web-applications faster, with the responsive design approach in mind.

Imagine we want to set the font color blue.

This is our HTML:

<p>Blue text</p>

This is our styling of it in pure CSS:

p {

color: blue;

}

image from unsplash.com

Using a CSS framework, you add the necessary, predefined class right to the paragraph in HTML (and don’t add anything to your style.css). This is what it looks like in different CSS frameworks:

• Bootstrap:

<p class=“text-primary”>Blue text</p>

• Foundation:

<p class=“primary”>Blue text</p>

• Materialize:

<p class=“blue”>Blue text</p>

• Tailwind:

<p class=“text-blue-600”>Blue text</p>

*the number defines the shade of the color

• Bulma:

<p class=“has-text-link”>Blue text</p>

The result is going to be the same: the font color is blue 💙

The good thing here is: once you understand how one CSS framework works, you can easily pick up any other. I started with Bootstrap and then learnt Tailwind and Bulma.

Which CSS frameworks are you familiar with?