...
Varje färgvariabel har också en tillhörande variabel som heter “on”. Denna används för att bestämma färg på exempelvis text eller ikon som placeras på den, i fallet den används som bakgrund. Primary/40 har alltså en kompletterande Primary/on-40-variabel.
Färg | Variabel | Värde | Utgående namn |
|---|---|---|---|
 | Primary/30 | #6A0032 | Basfärger/secondary-dark |
 | Primary/35 | #A00B36 | Webbspecifika färger/nav |
 | Primary/40 | #C12143 | Basfärger/main |
 | Primary/90 | #FAEEF0 | Basfärger/secondary-light |
 | Secondary/40 | #396291 | Himmel/sky-base |
 | Secondary/90 | #C6D2DF | Himmel/sky-line |
 | Secondary/95 | #F1F1F5 | Himmel/sky-background |
 | Accent/30 | #3B4266 | Himmel/sky-dark |
 | Accent/40 | #396291 | Webbspecifika färger/cta |
 | Accent/90 | #C6D2DF | Himmel/sky-background |
 | Neutral/20 | #353535 | Sten/stone-dark |
 | Neutral/40 | #636466 | Sten/stone-base |
 | Neutral/50 | #808285 | Sten/stone-clear |
 | Neutral/90 | #DADBDC | Sten/stone-line |
 | Neutral/99 | #F1F2F2 | Sten/stone-background |
 | Neutral/100 | #FFFFFF | Sten/white |
 | Success/30 | #395428 | Gräs/grass-dark |
 | Success/40 | #419002 | Gräs/grass-base |
 | Success/99 | #EEF8EE | Gräs/grass-background |
 | Attention/40 | #FFC100 | Sol/sun-clear |
 | Attention/95 | #FFF8E0 | Sol/sun-background |
 | Error/40 | #C12143 | Basfärger/main |
 | Error/99 | #FAEEF0 | Basfärger/secondary-light |
 | Background/40 | #FFFFFF | Basfärger/white |
Designspecifikation
...
1177:s färgpalett består av en röd primärfärg, sekundärfärgerna mörkröd och ljusrosa och ett antal komplementfärger där blå är det vi främst använder.
...
Hjälp oss att förbättra den här sidan genom att ge feedback, ställa frågor och lämna andra kommentarer på Inera UX Slacken i kanalen #komponenter_design eller #komponenter_kod alternativt kan du använda vårt formulär.
Publicerad | |
|---|---|
Senast uppdaterad |