Style Guide

A collection of useful components used in Pi Frame

Colours

These are the global colour swatches that are used to brand this website.

You can edit these easily throughout the entire site by clicking on the swatch, and editing the global colour.
Base Green
Secondary Green 80
Secondary Green 50
Secondary Green 30
Neutral Green Light
Accent Yellow
Accent Green

Typography

A complete list of the main type styles used throughout this website template.

Display Two

Display One

Heading One

Heading Two

Heading Three

Heading Four

Heading Five
Heading Six
Link Text
Large Text
Body Text
Small Text
Small Caps Text

Buttons

A set of all the buttons used on this template or customise them to suit your style or brand.