Bulma Color

Bulma is an Open source CSS framework developed by Jeremy Thomas. This framework is based on the CSS Flexbox property. It is highly responsive, minimizing the use of media queries for responsive behavior.

Color is a helper in Bulma that changes the color of the text or the background. We will see how we can change the text and background color using the classes of color.

Text Color classes: We can change the text color using the following classes.

• has-text-white
• has-text-black
• has-text-light
• has-text-dark
• has-text-primary
• has-text-link
• has-text-danger

Example 1: The following code demonstrates the has-text-primary class.

Output:

👁 Image

Example 2: The following code demonstrates the has-text-danger class.

Output:

👁 Image

Background Color classes: We can use the following classes for different background color and shades.

• has-background-white
• has-background-black
• has-background-light
• has-background-dark
• has-background-white
• has-background-primary
• has-background-warning
• has-background-grey-darker

Example 3: The following code demonstrates the has-background-dark class.

Output:

👁 Image

Example 4: The following code demonstrates the has-background-warning class.

Output:

👁 Image