Colours

Grays

black

gray4

gray3

gray2

gray1

white

Code Example

<div class="grid grid-cols2 t:grid-cols3">
<div class="p4 t-ta-c b-br1 bg-black">black</div>
<div class="p4 t-ta-c b-br1 bg-gray4">gray4</div>
<div class="p4 t-ta-c b-br1 bg-gray3">gray3</div>
<div class="p4 t-ta-c b-br1 bg-gray2">gray2</div>
<div class="p4 t-ta-c b-br1 bg-gray1">gray1</div>
<div class="p4 t-ta-c b-br1 bg-white">white</div>
</div>

Colours

blue-light

blue

blue-dark

red-light

red

red-dark

green-light

green

green-dark

yellow-light

yellow

yellow-dark

Code Example

<div class="grid grid-cols2 t:grid-cols3">
<div class="p4 t-ta-c b-br1 bg-blue-light">blue-light</div>
<div class="p4 t-ta-c b-br1 bg-blue">blue</div>
<div class="p4 t-ta-c b-br1 bg-blue-dark">blue-dark</div>
<div class="p4 t-ta-c b-br1 bg-red-light">red-light</div>
<div class="p4 t-ta-c b-br1 bg-red">red</div>
<div class="p4 t-ta-c b-br1 bg-red-dark">red-dark</div>
<div class="p4 t-ta-c b-br1 bg-green-light">green-light</div>
<div class="p4 t-ta-c b-br1 bg-green">green</div>
<div class="p4 t-ta-c b-br1 bg-green-dark">green-dark</div>
<div class="p4 t-ta-c b-br1 bg-yellow-light">yellow-light</div>
<div class="p4 t-ta-c b-br1 bg-yellow">yellow</div>
<div class="p4 t-ta-c b-br1 bg-yellow-dark">yellow-dark</div>
</div>