Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Typography - Museo Sans

Style Guide

Headings

Heading 3
second line of title

Heading 4
second line of title

Heading 5
second line of title
Heading 6
second line of title

Heading 2 with longer running title

.hero-paragraph

Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

paragraph

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet.

Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Colour

PRIMARY COLOURS
Fire Brick Red
#a90f09
Dark Orange
#e18d00
SECONDARY COLOURS
Dark Slate Grey
#09535b
Steel Blue
#1370b7
Dark Grey
#2d2d2d
Text Grey
#8a8a8a
Light Grey
#dadada
Body Background
#1a1a1a

Buttons

.button / .button .icon-button / .button .secondary

Custom Components

.ui-icon
.content-icon
.card

Design

I design bespoke brand identities and develop design systems that perform online and offline for clients and devices of all sizes.

Create

I create digital and physical user experiences and interactions that compliment your brand and deliver across media.

Code

I code tailored HTML & CSS front-end solutions for responsive websites, mobile applications and email marketing campaigns.

Guard

I guard your brand by offering on-going design consultancy and support to protect and develop your business into the future.

Service Name
Service Name
Service Name
Service Name
Service Name
Service Name
Service Name
Service Name
Service Name
Service Name
Service Name
Service Name

Core Custom Styles

.colour-block
.hollow
.primary-col-1

Heading 1

Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Heading 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

.primary-col-2

Heading 1

Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Heading 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

.dark-grey
.no-margin-top
.no-margin-bottom
.no-margin-right
.margin-left
.margin-right
.margin-right
.text-right
.no-padding-bottom

SECTIONS

Section
.hero-section
.full-height