Sign Up Sign Up
TY Shades Of Nokia 12

TY Shades Of Nokia 12

12-color palette · Warm · Mixed · Complementary harmony

Back to Library

TY Shades Of Nokia 12

12-color palette · Warm temperature · Mixed tone · Complementary harmony

Modify
Earthy 12 colors Warm Mixed Complementary limited retro versatile nokia
Likes 126
Colors 12

CSS variables

:root {
  --c-earthy-1: #C7F0D8;
  --c-earthy-2: #AA9D80;
  --c-earthy-3: #AA6D3C;
  --c-earthy-4: #744538;
  --c-earthy-5: #778D90;
  --c-earthy-6: #4A7885;
  --c-earthy-7: #695E70;
  --c-earthy-8: #3C4460;
  --c-earthy-9: #7D8540;
  --c-earthy-10: #43523D;
  --c-earthy-11: #3F3F3F;
  --c-earthy-12: #312B25;
}

About this palette

This 12-color earthy palette runs from Pickford (#C7F0D8) as its lightest tone to Industrial Black (#312B25) as its darkest. It blends Pickford, Winter Sage, Bourbon, Volcanic Brick, Leisure Time, Sky Space, Sedona Shadow, Diplomatic, Laird, Okroshka, Bauhaus and Industrial Black into a single set you can drop straight into a UI. Of its 66 color pairings, 7 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #C7F0D8 on #312B25 at 11.23:1.

Grounded, natural tones — suits sustainability/organic brands, coffee shops, outdoor gear, and warm editorial typography.

Color breakdown

Pickford #C7F0D8
RGB
rgb(199, 240, 216)
HSL
hsl(145, 58%, 86%)
Luminance
0.794
Winter Sage #AA9D80
RGB
rgb(170, 157, 128)
HSL
hsl(41, 20%, 58%)
Luminance
0.342
Bourbon #AA6D3C
RGB
rgb(170, 109, 60)
HSL
hsl(27, 48%, 45%)
Luminance
0.198
Volcanic Brick #744538
RGB
rgb(116, 69, 56)
HSL
hsl(13, 35%, 34%)
Luminance
0.083
Leisure Time #778D90
RGB
rgb(119, 141, 144)
HSL
hsl(187, 10%, 52%)
Luminance
0.250
Sky Space #4A7885
RGB
rgb(74, 120, 133)
HSL
hsl(193, 29%, 41%)
Luminance
0.166
Sedona Shadow #695E70
RGB
rgb(105, 94, 112)
HSL
hsl(277, 9%, 40%)
Luminance
0.122
Diplomatic #3C4460
RGB
rgb(60, 68, 96)
HSL
hsl(227, 23%, 31%)
Luminance
0.059
Laird #7D8540
RGB
rgb(125, 133, 64)
HSL
hsl(67, 35%, 39%)
Luminance
0.215
Okroshka #43523D
RGB
rgb(67, 82, 61)
HSL
hsl(103, 15%, 28%)
Luminance
0.076
Bauhaus #3F3F3F
RGB
rgb(63, 63, 63)
HSL
hsl(0, 0%, 25%)
Luminance
0.050
Industrial Black #312B25
RGB
rgb(49, 43, 37)
HSL
hsl(30, 14%, 17%)
Luminance
0.025

Contrast & accessibility

7 of 66 color pairings meet the WCAG AA contrast threshold (4.5:1) for body text.

Aa #C7F0D8 on #312B25 11.23:1 AAA
Aa #C7F0D8 on #3F3F3F 8.47:1 AAA
Aa #C7F0D8 on #3C4460 7.72:1 AAA
Aa #C7F0D8 on #43523D 6.72:1 AA
Aa #C7F0D8 on #744538 6.37:1 AA
Aa #AA9D80 on #312B25 5.22:1 AA
Aa #C7F0D8 on #695E70 4.91:1 AA
Aa #778D90 on #312B25 3.99:1 AA Large
Aa #AA9D80 on #3F3F3F 3.93:1 AA Large
Aa #C7F0D8 on #4A7885 3.91:1 AA Large
Aa #AA9D80 on #3C4460 3.59:1 AA Large
Aa #7D8540 on #312B25 3.53:1 AA Large
Aa #C7F0D8 on #AA6D3C 3.40:1 AA Large
Aa #AA6D3C on #312B25 3.30:1 AA Large
Aa #C7F0D8 on #7D8540 3.19:1 AA Large
Aa #AA9D80 on #43523D 3.12:1 AA Large
Aa #778D90 on #3F3F3F 3.01:1 AA Large
Aa #AA9D80 on #744538 2.96:1 Fail
Aa #4A7885 on #312B25 2.87:1 Fail
Aa #C7F0D8 on #778D90 2.82:1 Fail
Aa #778D90 on #3C4460 2.74:1 Fail
Aa #7D8540 on #3F3F3F 2.66:1 Fail
Aa #AA6D3C on #3F3F3F 2.49:1 Fail
Aa #3C4460 on #7D8540 2.42:1 Fail
Aa #778D90 on #43523D 2.39:1 Fail
Aa #695E70 on #312B25 2.29:1 Fail
Aa #AA9D80 on #695E70 2.28:1 Fail
Aa #AA6D3C on #3C4460 2.27:1 Fail
Aa #744538 on #778D90 2.26:1 Fail
Aa #4A7885 on #3F3F3F 2.16:1 Fail
Aa #C7F0D8 on #AA9D80 2.15:1 Fail
Aa #7D8540 on #43523D 2.11:1 Fail
Aa #744538 on #7D8540 2.00:1 Fail
Aa #AA6D3C on #43523D 1.97:1 Fail
Aa #4A7885 on #3C4460 1.97:1 Fail
Aa #AA6D3C on #744538 1.87:1 Fail
Aa #AA9D80 on #4A7885 1.82:1 Fail
Aa #744538 on #312B25 1.76:1 Fail
Aa #778D90 on #695E70 1.75:1 Fail
Aa #4A7885 on #43523D 1.72:1 Fail
Aa #695E70 on #3F3F3F 1.72:1 Fail
Aa #43523D on #312B25 1.67:1 Fail
Aa #744538 on #4A7885 1.63:1 Fail
Aa #AA9D80 on #AA6D3C 1.58:1 Fail
Aa #695E70 on #3C4460 1.57:1 Fail
Aa #695E70 on #7D8540 1.54:1 Fail
Aa #AA9D80 on #7D8540 1.48:1 Fail
Aa #3C4460 on #312B25 1.46:1 Fail
Aa #AA6D3C on #695E70 1.44:1 Fail
Aa #778D90 on #4A7885 1.39:1 Fail
Aa #695E70 on #43523D 1.37:1 Fail
Aa #744538 on #3F3F3F 1.33:1 Fail
Aa #3F3F3F on #312B25 1.33:1 Fail
Aa #AA9D80 on #778D90 1.31:1 Fail
Aa #744538 on #695E70 1.30:1 Fail
Aa #4A7885 on #695E70 1.26:1 Fail
Aa #43523D on #3F3F3F 1.26:1 Fail
Aa #4A7885 on #7D8540 1.23:1 Fail
Aa #AA6D3C on #778D90 1.21:1 Fail
Aa #744538 on #3C4460 1.21:1 Fail
Aa #AA6D3C on #4A7885 1.15:1 Fail
Aa #3C4460 on #43523D 1.15:1 Fail
Aa #778D90 on #7D8540 1.13:1 Fail
Aa #3C4460 on #3F3F3F 1.10:1 Fail
Aa #AA6D3C on #7D8540 1.07:1 Fail
Aa #744538 on #43523D 1.05:1 Fail

Similar palettes

#F9ED69 #F08A5D #B83B5E #6A2C70
4 colors
#7D5A50 #B4846C #E5B299 #FCDEC0
4 colors
#FFF8EA #9E7676 #815B5B #594545
4 colors
#2C3639 #3F4E4F #A27B5C #DCD7C9
4 colors
#F67280 #C06C84 #6C5B7B #355C7D
4 colors
#2B2E4A #E84545 #903749 #53354A
4 colors
#E5D9B6 #A4BE7B #5F8D4E #285430
4 colors
#A9907E #F3DEBA #ABC4AA #675D50
4 colors