08 — Hurtigreferanse
Hurtigreferanse
Ettsides oppslag over det viktigste i Varnurs designsystem — til bruk når du designer raskt og trenger fasiten foran deg.
Essens
Alt på én side
Farger, typografi, rom og regler i kortform.
Fargepalett
Brand
Brand deep
Teal
Teal strong
Kobber
Kobber sterk
Mint
Mint soft
Typografi
Skrift
Inter
Brukes til alt — titler, brødtekst, grensesnitt og tabulære data.
Overskrift
Semibold · -0.03em · 1.2 linjehøyde
Brødtekst — lesbar i alle størrelser.
Regular · 16px · 1.65 linjehøyde
Romskala
- 4pxIkongap
- 8pxLite mellomrom
- 16pxStandard
- 24pxKomponentgap
- 48pxSeksjonsgap
Bruk av farge
Navy — strukturTeal — data og aktivKobber — beslutning
Navy bærer flater og tekst, teal markerer teknologi og aktive tilstander, kobber brukes kun til varsler, nøkkeltall og handlinger.
Gjør
- Bruk navy som bærende flate og tekstfarge
- Bruk teal til data og aktive tilstander
- Maks ett kobberelement per skjermbilde
- Sett all tekst i Inter
Ikke gjør
- Ikke bruk kobber som generell merkevarefarge
- Ikke innfør farger utenfor de åtte i paletten
- Ikke innfør nye skrifttyper eller gradienter
- Ikke bruk lav kontrast på datatekst