lestrentenaires.ch is built on a pure-white canvas (rgb(255,255,255)).
The system uses rgb(194, 131, 14) as the high-saturation accent for primary actions.
Sharp 0px corners on CTAs — architectural restraint, engineering precision alongside Hammersmith One as the primary typeface.
A restrained elevation system (1 distinct shadow) — shadows reserved for the few elements that must lift off the page.
Motion is a first-class concern — 13 keyframe animations plus transition-driven interactions.
Accent #c2830e · police principale Roboto
Chaque valeur ci-dessous est vérifiée à la capture. getdesign.md décrit — prismd montre : chaque couleur, police et courbe ici a été lue via getComputedStyle() sur le rendu réel capturé à droite, jamais affirmée à la main.
Rapport DESIGN.md complet · light & dark · fichiers tokens · Paiement non activé — on mesure la demande d’abord.
7 familles de composants · 26 variantes comptées sur le DOM live
Composant
Variantes
nav Links
×9
links
×9
buttons
×2
heading H2
×2
heading H3
×2
heading H1
×1
heading H4
×1
07
Mise en page — structure & dimensions
4 métriques de layout mesurées
header Height64px
sidebar Width0px
gap16px
container Padding0px
08
Responsive — vrais breakpoints
11 points de rupture lus dans le CSS live
599px
600px
959px
960px
1024px
1025px
1279px
1280px
1440px
1441px
1920px
09
À faire / À éviter
14 règles applicables, verbatim de la spec
À faire
The system uses a single text weight (400) — hierarchy comes from size and color, not weight
Use the extracted shadow patterns for elevation — they are tuned to match the brand palette
Use full-pill radius (9999px) only for specific elements (avatars, pills, toggles)
Use Honey (`#c2830e`) as the primary accent — it's the brand's signature interactive color
Maintain nav height at 88px — consistent vertical space for the navigation bar
Respect the 8px–219px spacing range — the design uses a wide scale for visual breathing room
Make the navigation sticky — it stays visible during scroll, signaling content depth
À éviter
Don't introduce bolder or lighter weights — 400 is the only weight in this system
Don't invent new shadow values — use only the extracted shadow levels
Don't apply pill radius on rectangular buttons or cards — it's reserved for specific interactive elements
Don't introduce additional saturated accent colors — the palette is intentionally controlled
Don't collapse or hide the nav on scroll without an explicit scroll-triggered animation — the design uses fixed nav presence
Don't put a CTA button in the nav — this design uses links only at the top
Don't over-build the footer — this design keeps it minimal (1 cols, 0 links)
10
Guide agent & export
Prompt prêt à coller + les vrais fichiers derrière cette page
Construis une UI dans le design system de lestrentenaires.ch.
Fond #ffffff · encre #000000 · accent #c2830e.
Typo : Roboto — respecte l’échelle taille/graisse du §3.
Arrondis, espacements, ombres : uniquement les échelles extraites (aucun nombre magique).
La spec complète suit — colle le DESIGN.md ci-dessous dans ton agent.
Chaque valeur ci-dessus est vérifiée par getComputedStyle.
