Color

Primary Palette

The base colours are indicated second row from the top. For other shades and tints, it can be generated by changing the brightness percentage of the base colour. These base colours are chosen from the Mozilla Unified Palette (vibrant RGB)

Accent Palette

Examples

Base colour palette application:

Accent colour palette application:

Application in code

If you are using LESS as the CSS preprocessor you can generate base colour variants. For darker shades, refer to the percentage indicated on the graph and use the darken function to generate the colour code (e.g. darken(@basecolor, 15%)). Similarly for lighter tints, refer to the percentage indicated on the graph and use the lighten function (e.g. lighten(@basecolor, 30%)).