Red
#E0000F
- Used as primary call-to-action color
- Sometimes for backgrounds
- Sometimes used to add extra attention
Dark
#3B3B3B
- General font color
White
#FFFFFF
- Used for backgrounds to create variation between insections
- Using these colors in varying combinations is an important part of the digital HAT expression
Soft blue
#BDCDDA
Soft blue light
#DDE7ED
Sage green
#BFCFBE
Sage green light
#E6EDE4
Warm grey
#DED7D6
Warm grey light
#F2EFEF
Warm grey extra light
#F6F6F6
Neutral transparent pallette to be used as subtle divisions and effects in UI and as dividers
Dark 90%
90% #3B3B3B
Dark 66%
66% #3B3B3B
Soft blue
#BDCDDA
Soft blue light
#DDE7ED
Sage green
#BFCFBE
Sage green light
#E6EDE4
- UI feedback colors
- Used for statuses (product status, order status etc.)
Success
#22CF1E
Soft blue light
#DDE7ED
Error
#E0000F
White typeface
#FFFFFF
- On the Red background, all typefaces should be always white
- The same rule applies to dark grey background, that’s used in the Footer
Dark typeface
#3B3B3B
- Genral and mostly used font color is Dark. This color combination applies to all backgrounds presented below the top example
Red typeface
#E0000F
- Red typeface is sometimes used
- Used as highlighting color for the text