SASS Files

Generate what you need

Bulma consists of 53 .sass files that you can import individually. You can learn more about Bulma modularity in the documentation.

Simply select the .sass files you need and they will be compiled into a customized Bulma build.

Variables

Bulma offers 0 variables that you can edit to match your design.

Selectors with have customizable variables.

Click the icon to reveal the variables’ editing fields, edit as needed or leave empty for default.

Utilities (required)

Base

Elements

Form

Components

Grid

Helpers

Layout

Compile and Download

Your own custom Bulma build

Super! Your custom build is now ready to be compiled and downloaded.

Simply select how you want the output CSS file to be formated, choose other options as needed, and click the button to initialize the process.

Select your preference for how the output CSS code is styled. More details are available in SASS Docs.

Defaults to bulma.css. No need to add file extension, it will be appended with .css.

If selected, file name would become something like bulma_1680438216.css

If selected, the download would be a bundle zip package that includes the compiled css file along with sass source files, the config file, and an html starter template.

This will include the SASS sourcemap file in the bundled package; the soucemap file will be named something like bulma.css.map depending on your selections. This option could take a bit longer to process.