Bulma Installation

Bulma is a CSS library that provides CSS classes and it is used with HTML to provide specific styles.Bulma installation process can be done either using the npm command or using hosted CDN links.

Bulma CSS library can be used inside the project in the following ways.

  • Using NPM
  • Using Hosted CDN
  • Install Locally

Bulma CSS Installation Using NPM

Use the following given npm command to insert the Bulma framework inside the project.

    npm install bulma

2. Bulma Installation Using Hosted CDN

You can also use hosted CDN link of the Bulma CSS library. Simply, you have to add the following URL in the head section using <link>

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.6.0/css/bulma.min.css">

General Syntax

 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.6.0/css/bulma.min.css" />
Try it now

3.Install Locally

Simply, you have to visit https://github.com/jgthms/bulma/tree/master/css download the Bulma CSS library, and add it inside the head section of the web page using <link>

General Syntax

  <link rel="stylesheet" href="../code-support/library/css/bulma.min.css" />
Try it now

Starter Template

You can quick start with Bulma CSS framework using starter template:

General Syntax

        <!DOCTYPE html>
<html lang="en">
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Bulma CSS Starter Template</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.6.0/css/bulma.min.css" />
    <section class="section">
      <div class="container">
        <h1 class="title">
          Hello World
        <p class="subtitle">
          This is a Bulma CSS starter template.
Try it now
Web Tutorials
Bulma Installation
Html Tutorial HTML
Javascript Tutorial JAVASCRIPT
Css Tutorial CSS
Bootstrap 5 Tutorial BOOTSTRAP 5
Bootstrap 4 Tutorial BOOTSTRAP 4