Colors | siimple css

Colors

Change the color of the text or background

Added in v3.1.0

Text color

Set the text color of any element. There is an extra class, siimple--color-white that sets the text color to white.

Primary text color

Success text color

Warning text color

Error text color

Dark text color

Light text color

White text color

<div class="siimple--color-primary">Primary text color</div>
<div class="siimple--color-success">Success text color</div>
<div class="siimple--color-warning">Warning text color</div>
<div class="siimple--color-error">Error text color</div>
<div class="siimple--color-dark">Dark text color</div>
<div class="siimple--color-light">Light text color</div>
<div class="siimple--color-white siimple--bg-dark">White text color</div>

Background color

Set the background color of any element. There is an extra class, siimple--bg-white that sets the background color to white.

Primary background color

Success background color

Warning background color

Error background color

Dark background color

Light background color

White background color

<div class="bg-example siimple--bg-primary siimple--color-white">
    Primary background color
</div>
<div class="bg-example siimple--bg-success siimple--color-white">
    Success background color
</div>
<div class="bg-example siimple--bg-warning siimple--color-white">
    Warning background color
</div>
<div class="bg-example siimple--bg-error siimple--color-white">
    Error background color
</div>
<div class="bg-example siimple--bg-dark siimple--color-white">
    Dark background color
</div>
<div class="bg-example siimple--bg-light">
    Light background color
</div>
<div class="bg-example siimple--bg-white">
    White background color
</div>

Colors helpers are only avaiable for the new colors API introduced in v3.1.0.

Found a mistake or want to help improve this documentation? Suggest changes.