Style Guide

Typographies

Headings

H1
Heading 1
H1 light
Heading 1 light
H2
Heading 2
H2 light
Heading 2 light
H3
Heading 3
H3
Heading 3
H4
Heading 4

Text

L bold
Large bold
L
Large
M bold
Medium bold
M
Medium
S bold
Small bold
S
Small
XS bold
XSmall bold
XS
XSmall

Color

Text

100
Text primary
#333333
50
Text secondary
#797979
Aa
Text third
#8ec9f6
Aa
Text fourth
#ee7a0d

Background

100
Background primary
#333333
50
Background secondary
#797979
Aa
Background third
#8ec9f6
Aa
Background fourth
#ee7a0d

Border

100
Border primary
#333333
50
Border secondary
#797979

Shadows

Shadow bloc
Shadow card

UI Elements

CTA

Contact
Learn more
Learn more
Inquire
En savoir plus
All Links

Grid

Cards

Heading

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.

Contact

Heading

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

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.

CONTACT

Heading

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.

CONTACT

Heading

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.

CONTACT
Form
Merci, nous allons traiter votre message. 
Oups... Nous avons rencontré une petite erreur. Vous pouvez retenter dans 5 minutes.
Rich text

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

Block quote

Ordered list

  1. Item 1
  2. Item 2
  3. Item 3

Unordered list

  • Item A
  • Item B
  • Item C

Text link

Bold text

Emphasis

Superscript

Subscript