Styleguide | IZI Travel

Heading 1
SkolarPEWeb-Regular
Font-size: 36px; Line-height: 45px
#333333

Heading 2
SkolarPEWeb-Regular
Font-size: 28px; Line-height: 35px;
#333333

Lead or subheading
Proxima Light
Font-size: 20px; Line-height: 25px;
#666666

Heading 3
Proxima Bold
Font-size: 18px; Line-height: 23px;
#333333

Paragraph
Proxima Light
Font-size: 16px; Line-height: 24px
#333333

Mobile - Heading 1
SkolarPEWeb-Regular
Font-size: 24px; Line-height: 30px
#333333

Mobile - Heading 2
SkolarPEWeb-Regular
Font-size: 20px; Line-height: 25px;
#333333

Mobile - lead or subheading
Proxima Light
Font-size: 18px; Line-height: 23px;
#666666

Heading 3
Proxima Bold
Font-size: 17px; Line-height: 22px;
#333333

Desktop example text

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar tempor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam fermentum, nulla luctus pharetra vulputate, felis tellus mollis orci, sed rhoncus sapien nunc eget odio.

For the izi.TRAVEL styleguide

This is the desktop version

Better user experience

Mobile example text

For the izi.TRAVEL styleguide

This is the Mobile version

Better user experience

Primary #0E5671
Secundary #D21649
Alternative #2D90FE
Gray 1 #F8F8F8
Gray 2 #BBBBBB
Gray 3 #666666
Gray 4 #333333

Height: 48px; Border-radius: 2px;
Font-style inherit from "paragraph"

Example

Height: 48px; Border-radius: 2px;
Font-style inherit from "paragraph"

Example

Height: 48px; Border-radius: 2px;
Font-style inherit from "paragraph

Example

This is a text link #0E5677

Primary shape style

Secundary shape style