Style Guide Prello

Tous les éléments graphiques sont présentez ici. Ce sont les normes et structure réutilisables pour le design et l'intégration du site Prello.

Couleurs

Différentes couleurs de la charte graphique à utiliser pour composer

Black
#1f2d3e
Blue
#273E5A
Grey 800
#52657B
Grey 500
#939FAD
Grey 100
#e5ebf0
Salmon
#E68A68
Salmon 800
#eba186
Salmon 400
#f5d0c3
Salmon 200
#fae8e1
Salmon 100
#fdf3f0
Orange
#121f3e
Orange 800
#EFB581
Orange 100
#FDF6EF
Yellow
#ffe999
Yellow 100
#FFFDF5
Cyan
#83b9bb
Cyan 100
#F3F8F8
Couleurs

Différentes couleurs de la charte graphique à utiliser pour composer

Black
#1f2d3e

Typography

Les différentes typographies utilisées pour le titres et les paragraphes de texte.

Greycliff CF

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Display Heading

Display Heading

Heading H1

H1 Title

Heading H2

H2 Title

Heading H3

H3 Title

Subtitle over heading

subtitle

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.

Paragraph

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.

Paragraph (Small)

Boutons

Les différents type de boutons utilisées avec les couleurs, typographies et radius.

Button

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Button

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

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.

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.

image d'un bien

Histoire d'une randonnée

Notre famille, c’est notre trésor et il devenait compliqué d’accueillir tout le monde dans notre petit appartement lyonnais. Alors, nous avons décidé de prendre deux parts d’une maison de campagne

Heading

Propriétaires d’une maison dans la Drôme Provencale
Button Text
image d'un bien

Histoire d'une randonnée

Notre famille, c’est notre trésor et il devenait compliqué d’accueillir tout le monde dans notre petit appartement lyonnais. Alors, nous avons décidé de prendre deux parts d’une maison de campagne

Heading

Propriétaires d’une maison dans la Drôme Provencale
Button Text
image d'un bien

Histoire d'une randonnée

Notre famille, c’est notre trésor et il devenait compliqué d’accueillir tout le monde dans notre petit appartement lyonnais. Alors, nous avons décidé de prendre deux parts d’une maison de campagne

Heading

Propriétaires d’une maison dans la Drôme Provencale
Button Text