Development
>
Brand Style Guide
Spacey Studios
spaceystudios.com.au

Playfair Display

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 !@#$%^&*()

Quicksand

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 !@#$%^&*()

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
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.

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.

Base

These are the base black and white colour styles.

White
#FFFFFF
Black
#000000

Grey

Grey is a neutral colour and is the foundation of the colour system. Almost everything in UI design – text, form fields, backgrounds, dividers – are usually gray.

25
#FCFCFD
50
#F9FAFB
100
#F2F4F7
200
#EAECF0
300
#D0D5DD
400
#98A2B3
500
#667085
600
#475467
700
#344054
800
#1D2939
900
#101828

Grey Modern

Grey Modern is a variation of the base grey colour and is used across a number of elements that need a slight twist to the traditional grey tones.

25
#FCFCFD
50
#F8FAFC
100
#EEF2F6
200
#E3E8EF
300
#CDD5DF
400
#9AA4B2
500
#697586
600
#4B5565
700
#364152
800
#202939
900
#121926

Grey Neutral

Grey Neutral is a variation of the base grey colour and is used across a number of elements that need a slight twist to the traditional grey tones.

25
#FCFCFD
50
#F9FAFB
100
#F3F4F6
200
#E5E7EB
300
#D2D6DB
400
#9DA4AE
500
#6C737F
600
#4D5761
700
#384250
800
#1F2A37
900
#111927