Stijlgids & design system
Alle bouwstenen van lijstsamenwerking.nl op één pagina. Elk component bestaat als herbruikbare CSS-klasse in assets/stijl.css en is 1-op-1 om te zetten naar Framer- of React-componenten.
Logo
Het bestaande logo — de gele sticker met "De kracht van Samenwerking" — blijft het officiële merk. Voor de site is het vector-hertekend (Caveat + Anton als benadering); vraag bij de drukker het originele vectorbestand op voor pixelperfecte weergave.
Regels: rotatie −3,5°, nooit vervormen, minimaal 40 px hoog, vrije ruimte rondom minimaal ½ stickerbreedte. Het rood en geel uit het logo worden niet als interfacekleur gebruikt.
Kleuren
Groen als basis, salie als achtergrondfamilie, neutrale tinten voor tekst. Alle tekstkleuren voldoen aan WCAG 2.2 AA.
Typografie
Manrope (600–800) voor koppen en knoppen, Inter (400–600) voor lopende tekst. Anton en Caveat zijn gereserveerd voor het logo.
Kop 1 — Manrope 800
Kop 2 — Manrope 800
Kop 3 — Manrope 700
Lopende tekst — Inter 400, 16,5 px met regelafstand 1,65. Korte alinea's, maximaal ±68 tekens per regel, duidelijke tussenkoppen. Een link ziet er zo uit.
Meta-tekst — Inter 500, 14 px, kleur tekst-2.
Kicker-label — Manrope 700Knoppen & links
Kaarten
Alle kaarten: radius 16, rand #E2E8E2, zachte schaduw. Klikbare kaarten krijgen hover-lift (−3 px) en een groene randtint.
Formulier
Hulptekst onder het veld.
Succesmelding na verzenden — groen vlak, geen pop-up.