Rendez-Vous Urbains UI Kit

Style Guide

Page de reference pour valider rapidement les fondations visuelles: typographie, composants reutilisables, et conventions de mise en page.

Typographie

Heading H1 - Titre principal

Heading H2 - Titre section

Heading H3 - Sous-section

Heading H4 - Intertitre

Heading H5 - Petit titre
Heading H6 - Label

Paragraphe standard avec lien inline, texte fort, emphase et inline code.

"Un bon systeme de design rend les projets plus rapides a construire et plus coherents a faire evoluer."
  • Liste non ordonnee - item 1
  • Liste non ordonnee - item 2
  1. Liste ordonnee - item 1
  2. Liste ordonnee - item 2

Palette

Texte

#ffffff

Fond

#0c1c28

Bordure

rgba(255,255,255,0.22)

Accent (corail)

#f3a68f

Boutons

Cartes

Nouveau

Card standard

Composant de base reutilisable pour contenu, feature ou listing.

Action

Article

Card elevated

Version avec ombre plus marquee pour sections marketing.

En savoir plus

Formulaires

Badges et alerts

Default Soft Success Warning
Info: Ce template sert de reference commune.
Succes: composant valide et pret a reutiliser.
Attention: verifier contraste avant livraison.

Tableaux

Token Usage Valeur
Primary CTA, liens action #2b6cb0
Border Separateurs, cards #ddd
Content Width Container global 88rem

Grid 12 Demo

Active le bouton Grille 12 (en bas a gauche, mode dev) pour verifier l'alignement exact des colonnes et des gaps.

u-col-6
u-col-6
u-col-5
u-col-7
u-col-4
u-col-8
u-col-3
u-col-3
u-col-3
u-col-3
u-col-2
u-col-10