Styleguide 0.1.0

2 - Colors

2.1 - Primary color

Learn the hex by heart.

#FFF4F4 rgb(252,244,244) $primary-color
<div class="styleguide-color-bar bg-primary">#FFF4F4 rgb(252,244,244) $primary-color</div>

2.1.2 - Secondary color

Learn the hex by heart.

#FF3B65 rgb(255,59,101) $second-color
<div class="styleguide-color-bar bg-second">#FF3B65 rgb(255,59,101) $second-color</div>

2.1.3 - External color

#0000FF rgb(0,255,100) $external-color
<div class="styleguide-color-bar bg-external">#0000FF rgb(0,255,100) $external-color</div>

2.2 - Tints and shades

  • darker
  • dark
  •  
  • light
  • lighter
<ul class="styleguide-color-bar">
  <li class="bg-primary-darker">darker</li>
  <li class="bg-primary-dark">dark</li>
  <li class="bg-primary">&nbsp;</li>
  <li class="bg-primary-light">light</li>
  <li class="bg-primary-lighter">lighter</li>
</ul>