Design Tokens

Référence des tokens

Liste complète des design tokens utilisés dans AVS : couleurs, espacements, typographie, etc.

Explication

La palette AVS est extraite de pigments naturels africains. Chaque couleur est documentée avec sa source ethnographique primaire. Cliquez sur un swatch pour copier le HEX.

Palette principale

CSS Custom Properties

avs-tokens.css

:root {
  --avs-primary:   #C0573E;
  --avs-secondary: #F5EBE0;
  --avs-accent:    #1D1D1B;
  --avs-kente:     #D4A017;
  --avs-ndop:      #4A6741;
  --avs-indigo:    #2A4A6B;
  --avs-earth:     #8B4513;
  --avs-raffia:    #C8A96E;

  --shadow-avs:    3px 3px 0px 0px var(--avs-accent);
  --shadow-avs-md: 5px 5px 0px 0px var(--avs-primary);
  --radius-avs:    0.375rem;
  --radius-avs-lg: 1.25rem;
  --transition:    250ms cubic-bezier(0.4, 0, 0.2, 1);
}

Typographie

Échelle typographique

Display — Playfair Display

Body — DM Sans · Texte courant et interfaces

Mono — JetBrains Mono · Code et tokens