Page tree
Skip to end of metadata
Go to start of metadata


 

85% lighter
Swatch 


 

 

     
Hexadecimal #F7F7F8     
RGB value rgb(247, 247, 248)     
Sass variable $steel-85-light     

75% lighter 

Swatch


 

 


 

 


 

 


 

 


 

 


 

 


 

 

Hexadecimal#C7C7C9#F0F0F1#FEC2CF#E8E2F4#C3F1F7#C7FEF1#FFF9CD
RGB valuergb(199, 199, 201)rgb(240, 240, 241)rgb(254, 194, 207)rgb(232, 226, 244)rgb(195, 241, 247)rgb(199, 254, 241)rgb(255, 249, 205)
Sass variable$granite-75-light$steel-75-light$coral-75-light$violet-75-light$cornflower-75-light$mint-75-light$citrus-75-light
Base + 50% lighter
Swatch


 

 


 

 


 

 


 

 


 

 


 

 


 

 

Hexadecimal#8F9194#E3E3E4#FD85A0#B39FDB#89E3F0#9AFDE6#FFF59D
RGB valuergb(143, 145, 148)rgb(227, 227, 228)rgb(253, 133, 160)rgb(179, 159, 219)rgb(137, 227, 240)rgb(154, 253, 230)rgb(255, 245, 157)
Sass variable$granite-50-light$steel-50-light$coral-50-light$violet-50-light$cornflower-50-light$mint-50-light$citrus-50-light
25% lighter
Swatch


 

 


 

 


 

 


 

 


 

 


 

 


 

 

Hexadecimal#575A5E#D5D5D6#FC4871#8D71C9#4ED5E8#8AFFE3#FFF06C
RGB valuergb(87, 90, 94)rgb(213, 213, 214)rgb(252, 72, 133)rgb(141, 113, 201)rgb(78, 213, 232)rgb(138, 255, 227)rgb(255, 240, 108)
Sass variable$granite-25-light$steel-25-light$coral-25-light$violet-25-light$cornflower-25-light$mint-25-light$citrus-25-light
10% lighter
 


 

 

 

 

     
Hexadecimal#36393E      
RGB valuergb(54, 57, 62)      
Sass variable$granite-10-light      
Base
Swatch


 

 


 

 


 

 


 

 


 

 


 

 


 

 

Hexadecimal

#202329

#C7C7C9#EC0836#673AB7#14C8E1#64FFDA#FFEB3B
RGB valuergb(32, 35, 41)rgb(199, 199, 201)rgb(236, 8, 54) rgb(103, 58, 183)rgb(20, 200, 225)rgb(100, 255, 218)rgb(255, 253, 59)
Sass variable$granite

$granite-75-light

$steel

$coral

$violet$cornflower$mint$citrus
25% darker
 

 

 

 

 


 

 


 

 


 

 


 

 


 

 

Hexadecimal  #B80029#4D2D99#0096AA#00C596#FFC710
RGB value  rgb(184, 0, 41)rgb(77, 45, 153)rgb(0, 150, 170)rgb(0, 197, 150)rgb(255, 199, 16)
Sass variable  $coral-25-dark$violet-25-dark$cornflower-25-dark$mint-25-dark

$citrus-25-dark

50% darker
Swatch  


 

 


 

 


 

 


 

 


 

 

Hexadecimal  #81001D#321970#006473#008566#FD8D17
RGB value  rgb(129, 0, 29)rgb(50, 25, 112)rgb(0, 100, 115)rgb(0, 133, 102)rgb(253, 141, 23)
Sass variable  $coral-50-dark$violet-50-dark$cornflower-50-dark$mint-50-dark

$citrus-50-dark

65% darker
Swatch     


 

 

 
Hexadecimal     #00554E 
RGB value     

rgb(0,85,78)

 
Sass variable     n/a 

Colour contrast tests

See full Lens colour contrast and accessibility testing

 

 

 


Colour palette reference

Revised 6 October 2017



 

 

  • No labels