Bulma is a free, open source CSS framework based on Flexbox. This guide will show you how to get started with Gatsby and Bulma.
This guide assumes that you have a Gatsby project set up. If you need to set up a project, head to the Quick Start guide, then come back.
For starters, let’s install all the required packages we’re going to need.
yarn add bulma node-sass gatsby-plugin-sass
Then, add the
gatsby-plugin-sass in to
Now is the time to create a SCSS file that holds your simple style customization and the import statement for Bulma.
(To keep things simple, insert the file next to
index.js in the pages-directory)
The last step is to import the style and use it.
Replace the default contents of the
And that’s all there is to it! Now you can use Bulma as you normally would.