Bill Plant Style Guide

A top-level index of basic typography, colours and flexible components available for use on the Bill Plant website.

Typography

Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Heading 7

Donec id elit non mi porta gravida at eget metus. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec sed odio dui. Nulla vitae elit libero, a pharetra augue. Sed posuere consectetur est at lobortis. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Maecenas faucibus mollis interdum. Etiam porta sem malesuada magna mollis euismod. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.

  • List Item
  • List Item
  • List Item
  • List Item
  • List Item
  • List Item

Colours

#e40313 Red
#f28189 Red (50%)
#facdd0 Red (20%)
#fcd901 Yellow
#feec80 Yellow (50%)
#fef7cc Yellow (20%)
#000000 Black
#808080 Black (50%)
#e5e5e5 Black (10%)
#373737 Grey
#9b9b9b Grey (50%)
#f5f5f5 Grey (10%)
#a2e7f8 Blue
#d0f3fc Blue (50%)
#ecfafe Blue (10%)
#73e289 Green
#b9f1c4 Green (50%)
#e3f9e7 Green (10%)
#73e289 Orange
#facc84 Orange (50%)
#fdebce Orange (10%)

Gradients

Red → Orange
Orange → Yellow
Yellow → Green
Blue → White
Grey → White

Buttons

Off-Canvas Panel