#Colors

Cirrus has an extensive color palette that has been updated with 0.6.0 to make them more accessible to all page elements.

#Classes

Using a color within Cirrus is as simple as just prefixing the colors with bg- to color the background and with text- to color the text.

Examples

Button using indigo-500 for text and indigo-100 for the background.

<button class="text-indigo-500 bg-indigo-100">
    Custom Button
</button>

Square using a info background.

<div class="bg-info u-round mx-auto" style="height: 50px; width: 50px;"></div>

#v1 Colors

The standard color palette from older versions of the framework.

#v2 Colors

Cirrus has an extensive color palette that has been updated with 0.6.0 to make them more accessible to all page elements.