Basscss / Docs / Modules

Colors

 

basscss-colors v0.0.2

Colors

basscss.com

Use this suite of color and background color utilities to directly style elements.

.dark-gray .mid-gray .light-gray .lighter-gray .white .blue .red .yellow .green

<h3 class="center">
  <span class="dark-gray">.dark-gray</span>
  <span class="mid-gray">.mid-gray</span>
  <span class="light-gray">.light-gray</span>
  <span class="lighter-gray">.lighter-gray</span>
  <span class="white">.white</span>
  <span class="blue">.blue</span>
  <span class="red">.red</span>
  <span class="yellow">.yellow</span>
  <span class="green">.green</span>
</h3>
.bg-dark-gray
.bg-mid-gray
.bg-light-gray
.bg-lighter-gray
.bg-white
.bg-blue
.bg-red
.bg-yellow
.bg-green
.bg-darken-1
.bg-darken-2
.bg-darken-3
.bg-darken-4
<div class="center p1 white bg-dark-gray">.bg-dark-gray</div>
<div class="center p1 bg-mid-gray">.bg-mid-gray</div>
<div class="center p1 bg-light-gray">.bg-light-gray</div>
<div class="center p1 bg-lighter-gray">.bg-lighter-gray</div>
<div class="center p1 bg-white">.bg-white</div>
<div class="center p1 bg-blue">.bg-blue</div>
<div class="center p1 bg-red">.bg-red</div>
<div class="center p1 bg-yellow">.bg-yellow</div>
<div class="center p1 bg-green">.bg-green</div>
<div class="center p1 bg-darken-1">.bg-darken-1</div>
<div class="center p1 bg-darken-2">.bg-darken-2</div>
<div class="center p1 bg-darken-3">.bg-darken-3</div>
<div class="center p1 bg-darken-4">.bg-darken-4</div>