Designtokens
Kildesandheden er src/lib/design/palette.ts. Værdierne spejles i globals.css, og en test fejler hvis de to falder fra hinanden.
Mærkefarver
Givet af brandet. Ændres ikke.
ink
Tekst. Aldrig ren sort.
#2e2910forest
Primær. Navigation, knapper, aktive tilstande.
#2c5745parchment
Accent. Aldrig fuldfladebaggrund.
#ebe3a7Forest
Samme kulør og mætning som mærkefarven. 600 er mærkefarven selv.
forest-50
#f2f8f5forest-100
#deede7forest-200
#bcd7ccforest-300
#84b3a0forest-400
#559178forest-500
#3b6d58forest-600
mærkefarven
#2c5745forest-700
#264b3bforest-800
#1f3d30forest-900
#162c23forest-950
#0f1f18Tekst
Alle tre klarer AA på canvas, panel og sunken.
ink
#2e2910ink-muted
Sekundær tekst, labels.
#676351ink-subtle
Metadata, tidsstempler.
#767260Flader
Trukket mod inks varme kulør. Intet koldt gråt.
canvas
Sidebaggrund.
#fbfbf9panel
Kort, tabeller, dialoger.
#ffffffsunken
Tabelhoveder, stribede rækker.
#f4f4f0border
#e4e3ddborder-strong
#cfcdc3Status
Dæmpet og varm frem for Tailwinds defaults.
success
#266d4awarning
#9e671adanger
#a13b30info
#366278Kontrast
Hver parring håndhæves af contrast.test.ts. Alt skal mindst klare 4,5:1.
| Parring | Forhold | Prøve |
|---|---|---|
| brødtekst på canvas | 14.07:1 | Agn |
| dæmpet tekst på canvas | 5.82:1 | Agn |
| svag tekst på canvas | 4.66:1 | Agn |
| brødtekst på panel | 14.57:1 | Agn |
| dæmpet tekst på panel | 6.03:1 | Agn |
| brødtekst på sunken | 13.22:1 | Agn |
| dæmpet tekst på sunken | 5.47:1 | Agn |
| link på canvas | 7.93:1 | Agn |
| link på panel | 8.21:1 | Agn |
| hvid på primærknap | 8.21:1 | Agn |
| hvid på primærknap hover | 9.76:1 | Agn |
| hvid på navigation | 14.80:1 | Agn |
| brødtekst på parchment | 11.16:1 | Agn |
| dæmpet tekst på parchment | 4.62:1 | Agn |
| forest på parchment | 7.47:1 | Agn |
| succes på canvas | 6.02:1 | Agn |
| advarsel på canvas | 4.60:1 | Agn |
| fejl på canvas | 6.37:1 | Agn |
| info på canvas | 6.38:1 | Agn |
| hvid på succesfyld | 6.23:1 | Agn |
| hvid på advarselsfyld | 4.76:1 | Agn |
| hvid på fejlfyld | 6.60:1 | Agn |
| hvid på infofyld | 6.61:1 | Agn |
Tal i kolonner
tabular-nums er slået til globalt. Cifrene skal flugte lodret.
| Nordisk VVS ApS | 1.284.500 kr. |
| Bagerst Tømrer A/S | 96.000 kr. |
| Hansen & Co | 1.110 kr. |
Typografi
Archivo. Expanded kun til display-momenter.
Archivo almindelig — brødtekst i tabeller og formularer.
Small — sekundær information.
Extra small — metadata.