The best open source CSS frameworks

Although most websites run under a content manager, there is much to be said in favor of creating a portal from scratch. And, anyway, content managers also need someone to take care of their visual appearance. In this post we're going to go over some of the best tools for creating CSS stylesheets.

Let's start at the beginning. What is CSS?

What would the house of your dreams be like? Would it have one or two floors? Would you like the bedrooms downstairs and the kitchen upstairs? Why not put the bathtub in the bedroom?

And once that is resolved, what color would you paint the rooms? Would you make the front of stone?

We can make an analogy between a website and a house. On the one hand we have the structure of the site and on the other the visual aspect.  In the case the structure is determined with a plan and the visual aspect by looking at decoration samples.

CSS is the acronym for Cascading Style Sheets.. Whereas HTML is used to structure a web document (defining things like pages, headings and indicating when to embed images, video and other media) CSS sets the page layout style, colors, and typography.

With CSS you can define the style for each HTML element. Elements are the individual HTML components of a web page.

Style sheets they can be external, internal or online. If you want to use them externally, you have to save them as .css files and tell the .html file where to find them.

In internal mode, instructions are written in the header of a specific .html page. This makes page loading slower and modifications more complicated.

With online mode, the external stylesheet is hosted on a different server. They are especially suitable when we want to use them several times.

What is a CSS framework?

CSS frameworks they are tools used by user interface developers to make their work faster. Instead of creating solutions from scratch every time a new project comes up, lframeworks give developers the tools to quickly create user interfaces that can be adjusted and iterated as needed.

In a few words, we can define frameworks as a collection of CSS style sheets that are prepared and ready to use in different kinds of situations.

Saving time is not the only benefit that comes from using CSS frameworks. By using them, the designs are standardized and they allow a developer to easily read another developer's code.

The best open source CSS frameworks

Bootstrap

According to themselvesBootstrap is the most popular of the frameworks for HTML, CSS, and JS. It is ideal for designing mobile-friendly (Mobile first) and responsive sites.

Foundation

It seems that the people who make frameworks don't have a grandmother.
Foundation It is described as "The World's Most Advanced Adaptive Framework"

It is a useful tool for creating websites and web applications with an emphasis on business needs. Facebook, eBay, Mozilla, Adobe, HP, Cisco, and Disney are among its users.

Bulma

Bulma is a free and open source CSS framework based on Flexbox and used by more than 200.000 developers.

Flexbox was designed to help distribute the space between items in an interface and improve alignment capabilities. Flexbox handles layout in only one dimension at a time - either as a row or as a column. This is in contrast to the two-dimensional CSS Grid Layout model, which handles columns and rows at the same time.

Semantic UI

Semantic UI is a development framework that helps create beautiful and responsive layouts using human-friendly HTML.

This framework promises to allow us to build beautiful designs with its more than 3000 thematic variables and more than 50 user interface components.

It also integrates with many third-party libraries, including React, Angular, Meteor, or Ember.