Sign Up Sign Up
Nature 10

Nature 10

10-color palette · Warm · Mixed · Analogous harmony

Back to Library

Nature 10

10-color palette · Warm temperature · Mixed tone · Analogous harmony

Modify
Muted 10 colors Warm Mixed Analogous lowsaturation 10colors
Likes 40
Colors 10

CSS variables

:root {
  --c-muted-1: #BBC8C8;
  --c-muted-2: #CCD9D8;
  --c-muted-3: #715148;
  --c-muted-4: #85685C;
  --c-muted-5: #514E39;
  --c-muted-6: #948E69;
  --c-muted-7: #B7B399;
  --c-muted-8: #95AC71;
  --c-muted-9: #C88E55;
  --c-muted-10: #EBE6BE;
}

About this palette

This 10-color muted palette runs from Arctic Daisy (#EBE6BE) as its lightest tone to Panda (#514E39) as its darkest. It blends Oceanic Climate, Raffia Light Grey, Buffalo Herd, Quartersawn Oak, Panda, Extra Mile, Bonsai Pot, Geranium Leaf, Slightly Golden and Arctic Daisy into a single set you can drop straight into a UI. Of its 45 color pairings, 5 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #514E39 on #EBE6BE at 6.64:1.

A versatile palette suitable for marketing pages, product hero blocks, illustrations, and accent UI states.

Color breakdown

Oceanic Climate #BBC8C8
RGB
rgb(187, 200, 200)
HSL
hsl(180, 11%, 76%)
Luminance
0.560
Raffia Light Grey #CCD9D8
RGB
rgb(204, 217, 216)
HSL
hsl(175, 15%, 83%)
Luminance
0.674
Buffalo Herd #715148
RGB
rgb(113, 81, 72)
HSL
hsl(13, 22%, 36%)
Luminance
0.099
Quartersawn Oak #85685C
RGB
rgb(133, 104, 92)
HSL
hsl(18, 18%, 44%)
Luminance
0.157
Panda #514E39
RGB
rgb(81, 78, 57)
HSL
hsl(53, 17%, 27%)
Luminance
0.075
Extra Mile #948E69
RGB
rgb(148, 142, 105)
HSL
hsl(52, 17%, 50%)
Luminance
0.267
Bonsai Pot #B7B399
RGB
rgb(183, 179, 153)
HSL
hsl(52, 17%, 66%)
Luminance
0.446
Geranium Leaf #95AC71
RGB
rgb(149, 172, 113)
HSL
hsl(83, 26%, 56%)
Luminance
0.371
Slightly Golden #C88E55
RGB
rgb(200, 142, 85)
HSL
hsl(30, 51%, 56%)
Luminance
0.323
Arctic Daisy #EBE6BE
RGB
rgb(235, 230, 190)
HSL
hsl(53, 53%, 83%)
Luminance
0.780

Contrast & accessibility

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

Aa #514E39 on #EBE6BE 6.64:1 AA
Aa #CCD9D8 on #514E39 5.80:1 AA
Aa #715148 on #EBE6BE 5.58:1 AA
Aa #BBC8C8 on #514E39 4.89:1 AA
Aa #CCD9D8 on #715148 4.87:1 AA
Aa #BBC8C8 on #715148 4.11:1 AA Large
Aa #85685C on #EBE6BE 4.02:1 AA Large
Aa #514E39 on #B7B399 3.97:1 AA Large
Aa #CCD9D8 on #85685C 3.51:1 AA Large
Aa #514E39 on #95AC71 3.37:1 AA Large
Aa #715148 on #B7B399 3.34:1 AA Large
Aa #514E39 on #C88E55 2.98:1 Fail
Aa #BBC8C8 on #85685C 2.95:1 Fail
Aa #715148 on #95AC71 2.83:1 Fail
Aa #948E69 on #EBE6BE 2.62:1 Fail
Aa #514E39 on #948E69 2.53:1 Fail
Aa #715148 on #C88E55 2.51:1 Fail
Aa #85685C on #B7B399 2.40:1 Fail
Aa #CCD9D8 on #948E69 2.29:1 Fail
Aa #C88E55 on #EBE6BE 2.23:1 Fail
Aa #715148 on #948E69 2.13:1 Fail
Aa #85685C on #95AC71 2.04:1 Fail
Aa #95AC71 on #EBE6BE 1.97:1 Fail
Aa #CCD9D8 on #C88E55 1.94:1 Fail
Aa #BBC8C8 on #948E69 1.93:1 Fail
Aa #85685C on #C88E55 1.80:1 Fail
Aa #CCD9D8 on #95AC71 1.72:1 Fail
Aa #B7B399 on #EBE6BE 1.67:1 Fail
Aa #85685C on #514E39 1.65:1 Fail
Aa #BBC8C8 on #C88E55 1.64:1 Fail
Aa #948E69 on #B7B399 1.57:1 Fail
Aa #85685C on #948E69 1.53:1 Fail
Aa #CCD9D8 on #B7B399 1.46:1 Fail
Aa #BBC8C8 on #95AC71 1.45:1 Fail
Aa #715148 on #85685C 1.39:1 Fail
Aa #BBC8C8 on #EBE6BE 1.36:1 Fail
Aa #948E69 on #95AC71 1.33:1 Fail
Aa #B7B399 on #C88E55 1.33:1 Fail
Aa #BBC8C8 on #B7B399 1.23:1 Fail
Aa #BBC8C8 on #CCD9D8 1.19:1 Fail
Aa #715148 on #514E39 1.19:1 Fail
Aa #948E69 on #C88E55 1.18:1 Fail
Aa #B7B399 on #95AC71 1.18:1 Fail
Aa #CCD9D8 on #EBE6BE 1.15:1 Fail
Aa #95AC71 on #C88E55 1.13: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