Style docs

Buttons

Button colours

class="btn"
class="btn-blue"
class="btn-green"
class="btn-orange"
class="btn-red"
class="btn-black"

Button types

disabled="disabled"

Inputs & forms

Input colours

class="input"
class="input-blue"
class="input-green"
class="input-orange"
class="input-red"
class="input-black"

Form examples

Icons & glyphs

Icons by IcoMoon

Icon examples

class="icon-rocket"
class="icon-rocket"

Labels

Label colours

class="label"
class="label-blue"
class="label-green"
class="label-orange"
class="label-red"
class="label-black"

Typography

Headings

H1 heading

H2 heading

H3 heading

H4 heading

H5 heading
H6 heading

Underlined heading

Underlined

class="action_typography__underline"

Underlined

Underlined

class="action_typography__underline"

Underlined

Underlined

class="action_typography__underline"

Underlined

Underlined

class="action_typography__underline"

Underlined

Underlined
class="action_typography__underline"
Underlined
Underlined
class="action_typography__underline"
Underlined
Underlined heading colours

Underlined

class="action_typography__underline"

Underlined

Underlined

class="action_typography__underline-blue"

Underlined

Underlined

class="action_typography__underline-green"

Underlined

Underlined

class="action_typography__underline-orange"

Underlined

Underlined

class="action_typography__underline-red"

Underlined

Underlined

class="action_typography__underline-black"

Underlined

Alerts

Alert colours

Alert: Example
class="alert"
Alert: Example
Alert: Example
class="alert-blue"
Alert: Example
Alert: Example
class="alert-green"
Alert: Example
Alert: Example
class="alert-orange"
Alert: Example
Alert: Example
class="alert-red"
Alert: Example
Alert: Example
class="alert-black"
Alert: Example

Progress bars

Progress bar colours

class="progress_fill"
class="progress_fill-blue"
class="progress_fill-green"
class="progress_fill-orange"
class="progress_fill-red"
class="progress_fill-black"

Images

Images types

.image_soft CSS class example.
class="image_soft"
…
.image_round CSS class example.
class="image_round"
…

Images effects

.image_interactive CSS class example.
class="image_interactive"
…
.action_effect-reflect CSS class example.
class="action_effect-reflect"
…
.action_effect-reflect CSS class example.
class="image_round action_effect-reflect"
…