Introduksjon

Kilden er Bekks designsystem. Det gir deg ferdigbygde React-komponenter, design tokens og verktøy for å bygge tilgjengelige og konsistente brukergrensesnitt — raskt.

Hva er inkludert?

• 30+ React-komponenter — Knapper, skjemaelementer, dialoger, navigasjon og mer. Bygget på Radix UI for tilgjengelighet og CVA for type-sikre varianter.
• Design tokens — Farger, typografi, spacing, avrunding og skygger som CSS custom properties. Fungerer med og uten Tailwind CSS.
• 5 fargetemaer — Ild, Luft, Vann, Jord og Whitelabel — med innebygd støtte for lys og mørk modus.
• TypeScript-støtte — Fullstendig typet API med autocompletions for alle props og varianter.

Designprinsipper

• Tilgjengelig — Alle komponenter følger WAI-ARIA-retningslinjer og er testet med skjermlesere.
• Fleksibel — Komponenter kan tilpasses med varianter, Tailwind-klasser og asChild-mønsteret for full kontroll over HTML-output.
• Konsistent — Design tokens sikrer at farger, spacing og typografi er konsistente på tvers av alle løsninger.
• Enkel å ta i bruk — Installer pakken, importer CSS og en komponent, og du er i gang.

Pakker

Kilden består av to npm-pakker:

Begge pakkene er tilgjengelige på npm og kan installeres med din foretrukne pakkebehandler.

Kom i gang

Klar til å sette opp Kilden i prosjektet ditt? Gå til installasjonsguiden.