WEB UI STYLE GUIDELINES

Primary Color Palette

Black

#000000

Pink

#F6CFD0

Cyan

#BCEBEE

Yellow

#F0D47B

Color Tints

#999999
#b2b2b2
#cccccc
#e5e5e5
#f5f5f5
#eaacad
#f0bcbd
#f6cfd0
#fae4e4
#fdeff1
#76D0E0
#91DCE6
#BCEBEE
#DAF4F6
#E8F8F9
#F0D47B
#F3DC95
#F7E7B6
#FBF2D7
#FDF9EB

Secondary Color Palette

PURPLE

#6B4CD1

DARK BLUE

#2D78D0

BLUE JEANS

#4EADEA

GREEN

#78C692

DEEP YELLOW

#F5C242

COPPER

#DF8057

DARK PINK

#EE95AB

H1 Display
Festivo Letters No1
Regular
Font Size: 60px
Line Height: 1
Text Transform: uppercase
Color: #000000
The quick brown fox jumps over the lazy dog.
H1 Display Mobile
Font Size: 32px
Line Height: 1.11
H1
Festivo Letters No1
Regular
Font Size: 50px
Line Height: 1.04
Text Transform: uppercase
Color: #000000

The quick brown fox jumps over the lazy dog.

H1 Mobile
Font Size: 42px
Line Height: 1.04
H2
Festivo Letters No1
Regular
Font Size: 46px
Line Height: 1.04
Text Transform: uppercase
Color: #000000

The quick brown fox jumps over the lazy dog.

H2 Mobile
Font Size: 38px
Line Height: 1.05
H2 Display
BeachBar
Black
Font Size: 36px
Line Height: 1.22
Color: #000000
The quick brown fox jumps over the lazy dog.
H2 Display Mobile
Font Size: 30px
Line Height: 1.26
H3
Festivo Letters No1
Regular
Font Size: 36px
Line Height: 1.05
Text Transform: uppercase
Color: #000000

The quick brown fox jumps over the lazy dog.

H3 Mobile
Font Size: 30px
Line Height: 1.06
H3 Display
BeachBar
Black
Font Size: 24px
Line Height: 1.33
Color: #000000
The quick brown fox jumps over the lazy dog.
H3 Display Mobile
Font Size: 21px
Line Height: 1.38
H4
Festivo Letters No1
Regular
Font Size: 24px
Line Height: 1.16
Text Transform: uppercase
Color: #000000

The quick brown fox jumps over the lazy dog.

H4 Mobile
Font Size: 20px
Line Height: 1.2
H5
Quicksand
Regular/Medium/SemiBold/Bold
Font Size: 18px
Line Height: 1.44
Color: #000000
The quick brown fox jumps over the lazy dog.
H5 Mobile
Font Size: 16px
Line Height: 1.5
H6
Quicksand
Bold
Font Size: 15px
Line Height: 1.6
Text Transform: uppercase
Color: #000000
The quick brown fox jumps over the lazy dog.
H6 Mobile
Font Size: 14px
Line Height: 1.64
Paragraph
Quicksand
Regular/Medium/SemiBold/Bold
Font Size: 16px
Line Height: 1.5
Font Color: #000000

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.

Paragraph Mobile
Font Size: 14px
Line Height: 1.57
Paragraph Text Link
Quicksand
Bold
Font Size: 15px
Font Color: #000000
pipsticks@gmail.com
Normal Button
Large Button
Small Button

btn-link

Shop Now

badge

New

badge

sale
Form Floating