Guide de style web

La boucherie de Mamie

par Mathieu Lajeunesse médias interactifs

Couleurs

Couleurs générales

$black #050505 .bg-black $white #fff .bg-white $pink #eb008b .bg-pink $wine #8c0d57 .bg-wine

Typographie

Polices

Brisa

.font-brisa

Founders Grotesk

.font-founders-grotesk

En-têtes principaux

En-tête script

.heading-main

Sous-titre 48

.heading-2

Paragraphes

Texte intro 30 lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla gravida erat lacinia, iaculis justo vel, suscipit lacus. Pellentesque vestibulum euismod nunc, sit amet laoreet mauris bibendum vulputate. Integer ut lobortis odio. Nulla imperdiet, dui nec venenatis interdum, purus arcu auctor lectus, sit amet sollicitudin risus nibh id nisi.

.text-intro

Texte paragraphe 20 lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla gravida erat lacinia, iaculis justo vel, suscipit lacus. Pellentesque vestibulum euismod nunc, sit amet laoreet mauris bibendum vulputate. Integer ut lobortis odio. Nulla imperdiet, dui nec venenatis interdum, purus arcu auctor lectus, sit amet sollicitudin risus nibh id nisi.

.text-regular

Texte libellé 18

.text-label

Listes

Liste par défaut
Proin pulvinar erat sed imperdiet vestibulum.
Etiam sed ante eu ipsum aliquam porta.
Vestibulum rhoncus tortor sed cursus vehicula. Donec convallis orci et dolor efficitur, id consectetur nunc egestas. Donec convallis orci et dolor efficitur, id consectetur nunc egestas.

ul

Liste ordonnée par défaut
Proin pulvinar erat sed imperdiet vestibulum.
Etiam sed ante eu ipsum aliquam porta.
Vestibulum rhoncus tortor sed cursus vehicula. Donec convallis orci et dolor efficitur, id consectetur nunc egestas. Donec convallis orci et dolor efficitur, id consectetur nunc egestas.

ol

Liste sans points
Proin pulvinar erat sed imperdiet vestibulum.
Etiam sed ante eu ipsum aliquam porta.
Vestibulum rhoncus tortor sed cursus vehicula. Donec convallis orci et dolor efficitur, id consectetur nunc egestas. Donec convallis orci et dolor efficitur, id consectetur nunc egestas.

.list-plain

Liste espacée
Proin pulvinar erat sed imperdiet vestibulum.
Etiam sed ante eu ipsum aliquam porta.
Vestibulum rhoncus tortor sed cursus vehicula. Donec convallis orci et dolor efficitur, id consectetur nunc egestas. Donec convallis orci et dolor efficitur, id consectetur nunc egestas.

.list-spaced

Boutons

Bouton principal

.btn-primary