Design System Viewer

Démonstration des variables sémantiques

Typographie

H1. Titre Principal

H2. Sous-titre de section

Ceci est un paragraphe de corps de texte (--font-body). Il démontre la lisibilité de la police choisie pour le contenu principal. La taille est définie par --size-text et la couleur par --color-text.

Un autre paragraphe pour montrer l'espacement et le rythme vertical. Texte en gras et texte en italique héritent des propriétés de la police.

Composants UI

Tag / Badge Catégorie Nouveau

Palette Sémantique

Primary --color-primary
Secondary --color-secondary
Accent --color-accent
Background --color-background
Text Body --color-text
Text Heading --color-text-heading