Design System

Work in progress. I'm adding components as I go, following patterns from what's already documented. Nothing here is set in stone yet.

Section

Section wrapper that sets the accent color for its children. This is where the chromatic layer activates.

Section Pattern

Organism

Shared layout pattern used by Experiences, Realisations, and Formations sections.

Section Header

Mes

Expériences

Props

PropTypeDescription
idstringSection anchor ID
subtitlestringLabel above the title (e.g., "Mes")
titlestringSection heading

Sections

SectionColor ThemeCard Type
ExperiencesPink (#f68dab)CardContent
RealisationsGreen (#66c384)CardSplit
FormationsPurple (#9c85d3)CardContent

Each section overrides --accent-color and --secondary-accent-color via scoped :global(#id).

kinoo.dev · Design System