Getting started with Bulma

John Fajardo
6 min readJul 17, 2019

As beginner web developers, we are so preoccupied with making things work, that we completely neglect the aesthetic side of things. As a result, we often end up with brilliant pieces of work that while completely funcional, look plain ugly.

“But John, I have a deadline and I just need my app to pass the tests. Besides, there is Bootstrap!” Yes, Bootstrap is still a very relevant and valid option for any project, but sadly, it is often overkill and bloated. Enter Bulma.

According to its creator, “Bulma is a free, open source CSS framework based on Flexbox and used by more than 150,000 developers.” It claims to be an alternative to Bootstrap that offers bleeding edge features in a lightweight package that uses no javascript, all in a very simple to use fashion. This does not mean, however, that Bulma is meant to rival or substitute Bootstrap. Instead, it is an alternative to use in specific scenarios.

When should I use Bulma?

You should only use Bulma for projects in which you need a quick way to get a grid system up and running without too much fuss, when you want FontAwesome support or when you plan to write your own javascript or jquery plugins. However, if you need IE support, don’t have the time to write your own jquery plugins or you need additional accessibility features, you should stick with Bootstrap. It is also worth noting that while Bulma is very easy to use, it’s documentation is a little bit lacking and it still doesn’t have a very big community around it.

--

--