Colour Palette

The core Lens colour palette contains seven distinct colours.

Lens base colour palette

Granite

$granite

rgb(32, 35, 41)

#202329

Steel

$steel

rgb(199, 199, 201)

#C7C7C9

Coral

$coral

rgb(236, 8, 54)

#EC0836

Violet

$violet

rgb(103, 58, 183)

#673AB7

Mint

$mint

rgb(100, 255, 218)

#64FFDA

Citrus

$citrus

rgb(255, 253, 59)

#FFEB3B

Cornflower

$cornflower

rgb(20, 200, 225)

#14C8E1

Tints and shades

Each core colour can be tinted (made lighter) and shaded (made darker). Tints and shades give options in instances where using the 'full' colour would not work.

Our tints and shades have been hand-tweaked to avoid the indistinct, muddied tones that can be created by automated colour tools. To this end, tint and shade percentage values should be considered indicators and not exact measures.

GRANITE

50% light

$granite-50-light

rgb(143, 145, 148)

#8F9194

25% light

$granite-25-light

rgb(87, 90, 94)

#575A5E

10% light

$granite-10-light

rgb(54, 57, 62)

#36393E

Base colour

Granite

$granite

rgb(32, 35, 41)

#202329

STEEL

85% light

$steel-85-light

rgb(247, 247, 248)

#F7F7F8

75% light

$steel-75-light

rgb(240, 240, 241)

#F0F0F1

50% light

$steel-50-light

rgb(227, 227, 228)

#E3E3E4

25% light

$steel-25-light

rgb(213, 213, 214)

#D5D5D6

Base colour

Steel

$steel

rgb(199, 199, 201)

#C7C7C9

CORAL

75% light

$coral-75-light

rgb(254, 194, 207)

#FEC2CF

50% light

$coral-50-light

rgb(253, 133, 160)

#FD85A0

25% light

$coral-25-light

rgb(252, 72, 133)

#FC4871

Base colour

Coral

$coral

rgb(236, 8, 54)

#EC0836

25% dark

$coral-25-dark

rgb(184, 0, 41)

#B80029

50% dark

$coral-50-dark

rgb(129, 0, 29)

#81001D

VIOLET

75% light

$violet-75-light

rgb(232, 226, 244)

#E8E2F4

50% light

$violet-50-light

rgb(179, 159, 219)

#B39FDB

25% light

$violet-25-light

rgb(141, 113, 201)

#8D71C9

Base colour

Violet

$violet

rgb(103, 58, 183)

#673AB7

25% dark

$violet-25-dark

rgb(77, 45, 153)

#4D2D99

50% dark

$violet-50-dark

rgb(50, 25, 112)

#321970

MINT

75% light

$mint-75-light

rgb(199, 254, 241)

#C7FEF1

50% light

$mint-50-light

rgb(154, 253, 230)

#9AFDE6

25% light

$mint-25-light

rgb(138, 255, 227)

#8AFFE3

Base colour

Mint

$mint

rgb(100, 255, 218)

#64FFDA

10% dark

$mint-10-dark

rgb(0, 230, 176)

#00E6B0

25% dark

$mint-25-dark

rgb(0, 197, 150)

#00C596

50% dark

$mint-50-dark

rgb(0, 133, 102)

#008566

75% dark

$mint-75-dark

rgb(0, 85, 78)

#00554E

CITRUS

75% light

$citrus-75-light

rgb(255, 249, 205)

#FFF9CD

50% light

$citrus-50-light

rgb(255, 245, 157)

#FFF59D

25% light

$citrus-25-light

rgb(255, 240, 108)

#FFF06C

Base colour

Citrus

$citrus

rgb(255, 253, 59)

#FFEB3B

25% dark

$citrus-25-dark

rgb(255, 199, 16)

#FFC710

50% dark

$citrus-50-dark

rgb(253, 141, 23)

#FD8D17

75% dark

$citrus-75-dark

rgb(235, 109, 0)

#EB6D00

90% dark

$citrus-90-dark

rgb(198, 80, 1)

#C65001

CORNFLOWER

90% light

$cornflower-90-light

rgb(229, 255, 249)

#E5FFF9

75% light

$cornflower-75-light

rgb(195, 241, 247)

#C3F1F7

50% light

$cornflower-50-light

rgb(137, 227, 240)

#89E3F0

25% light

$cornflower-25-light

rgb(78, 213, 232)

#4ED5E8

Base colour

Cornflower

$cornflower

rgb(20, 200, 225)

#14C8E1

25% dark

$cornflower-25-dark

rgb(0, 150, 170)

#0096AA

50% dark

$cornflower-50-dark

rgb(0, 100, 115)

#006473

60% dark

$cornflower-60-dark

rgb(8, 80, 90)

#08505A