Firefly Design System

Typographic Scale

Mega Hero

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Title 1

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Title 2

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Title 3

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Title 4

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Title 5

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Title 6

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

SUBTITLE

Lorem ipsum dolor sit amet,

SUBTITLE META

Lorem ipsum dolor sit amet,

Intro Copy

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Body Copy

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Small Text

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Grid

1

2

3

4

5

6

7

8

9

10

11

1

2

3

4

5

6

7

8

9

1

2

3

4

5

6

7

1

2

3

4

5

1

2

3

Buttons

Default

Hover / Secondary

Inactive

Inactive - With Background

COLOUR PALETTE

Brand Colours

#1F1F1F

#313D3D

#F68720

#FFF

PROJECT Colours

#e04227

#35c2d9

#d9549f

#bfd736

#c7222a

#1583c4

#c01c8a

#5dbb49

Brand Colours

#1F1F1F

#313D3D

#F68720

#FFF

PROJECT Colours

#e04227

#35c2d9

#d9549f

#bfd736

#c7222a

#1583c4

#c01c8a

#5dbb49