Akari · UI-bibliotek

Lær navnene, snakk samme språk

Et interaktivt oppslagsverktøy for moderne UI-komponenter og designtokens. Hvert element viser norsk navn, en levende eller skjematisk forhåndsvisning, det offisielle engelske navnet og når det bør brukes. Trykk på et kort for detaljer, eller på det engelske navnet for å kopiere det.

/

Farger

Hele paletten som CSS-variabler. Trykk på en farge for å kopiere token-navnet (f.eks. --brand-turquoise).

Typografi

Skala i Red Hat Display (titler) og DM Sans (brødtekst). Trykk på en token for å kopiere.

Størrelser

Vekter

Avstand

Én skala med 4 px som grunnenhet – brukes til både padding og margin. Trykk for å kopiere.

Hjørneradius

Fra skarpe hjørner til pille og sirkel.

Skygger

Dybdeskygger pluss en turkis glød til fokus og hover. Vist på lys plate så skyggene synes.

Brytepunkter

Responsive terskler for media queries.

Z-indeks

Lagdeling så overlegg legger seg i riktig rekkefølge.

Bevegelse

Varighet og mykning. Respekter alltid prefers-reduced-motion.