Sign Up Sign Up
Ancient Interface

Ancient Interface

11-color palette · Warm · Mixed · Analogous harmony

Back to Library

Ancient Interface

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

Modify
Earthy 11 colors Warm Mixed Analogous pixelart interface ui orange
Likes 33
Colors 11

CSS variables

:root {
  --c-earthy-1: #DBB6B6;
  --c-earthy-2: #B69292;
  --c-earthy-3: #926D6D;
  --c-earthy-4: #6D4949;
  --c-earthy-5: #FFFFB6;
  --c-earthy-6: #FFDB92;
  --c-earthy-7: #FF9224;
  --c-earthy-8: #DB6D24;
  --c-earthy-9: #B62424;
  --c-earthy-10: #6D2424;
  --c-earthy-11: #000000;
}

About this palette

This 11-color earthy palette runs from Crème (#FFFFB6) as its lightest tone to Black (#000000) as its darkest. It blends Rose Coloured, Cherry Taupe, Moss Rose, Painite, Crème, Cha-Cha-Cha, Texas Sunset, Lusty Orange, Flamingo Fervour, Spanish Tile and Black into a single set you can drop straight into a UI. Of its 55 color pairings, 15 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #FFFFB6 on #000000 at 20.23:1.

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

Color breakdown

Rose Coloured #DBB6B6
RGB
rgb(219, 182, 182)
HSL
hsl(0, 34%, 79%)
Luminance
0.519
Cherry Taupe #B69292
RGB
rgb(182, 146, 146)
HSL
hsl(0, 20%, 64%)
Luminance
0.326
Moss Rose #926D6D
RGB
rgb(146, 109, 109)
HSL
hsl(0, 15%, 50%)
Luminance
0.182
Painite #6D4949
RGB
rgb(109, 73, 73)
HSL
hsl(0, 20%, 36%)
Luminance
0.085
Crème #FFFFB6
RGB
rgb(255, 255, 182)
HSL
hsl(60, 100%, 86%)
Luminance
0.962
Cha-Cha-Cha #FFDB92
RGB
rgb(255, 219, 146)
HSL
hsl(40, 100%, 79%)
Luminance
0.740
Texas Sunset #FF9224
RGB
rgb(255, 146, 36)
HSL
hsl(30, 100%, 57%)
Luminance
0.420
Lusty Orange #DB6D24
RGB
rgb(219, 109, 36)
HSL
hsl(24, 72%, 50%)
Luminance
0.261
Flamingo Fervour #B62424
RGB
rgb(182, 36, 36)
HSL
hsl(0, 67%, 43%)
Luminance
0.113
Spanish Tile #6D2424
RGB
rgb(109, 36, 36)
HSL
hsl(0, 50%, 28%)
Luminance
0.046
Black #000000
RGB
rgb(0, 0, 0)
HSL
hsl(0, 0%, 0%)
Luminance
0.000

Contrast & accessibility

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

Aa #FFFFB6 on #000000 20.23:1 AAA
Aa #FFDB92 on #000000 15.80:1 AAA
Aa #DBB6B6 on #000000 11.38:1 AAA
Aa #FFFFB6 on #6D2424 10.49:1 AAA
Aa #FF9224 on #000000 9.39:1 AAA
Aa #FFDB92 on #6D2424 8.19:1 AAA
Aa #B69292 on #000000 7.52:1 AAA
Aa #6D4949 on #FFFFB6 7.49:1 AAA
Aa #DB6D24 on #000000 6.22:1 AA
Aa #FFFFB6 on #B62424 6.19:1 AA
Aa #DBB6B6 on #6D2424 5.90:1 AA
Aa #6D4949 on #FFDB92 5.85:1 AA
Aa #FF9224 on #6D2424 4.87:1 AA
Aa #FFDB92 on #B62424 4.84:1 AA
Aa #926D6D on #000000 4.63:1 AA
Aa #926D6D on #FFFFB6 4.37:1 AA Large
Aa #DBB6B6 on #6D4949 4.22:1 AA Large
Aa #B69292 on #6D2424 3.90:1 AA Large
Aa #DBB6B6 on #B62424 3.48:1 AA Large
Aa #6D4949 on #FF9224 3.48:1 AA Large
Aa #926D6D on #FFDB92 3.41:1 AA Large
Aa #B62424 on #000000 3.27:1 AA Large
Aa #FFFFB6 on #DB6D24 3.25:1 AA Large
Aa #DB6D24 on #6D2424 3.23:1 AA Large
Aa #FF9224 on #B62424 2.87:1 Fail
Aa #B69292 on #6D4949 2.78:1 Fail
Aa #6D4949 on #000000 2.70:1 Fail
Aa #B69292 on #FFFFB6 2.69:1 Fail
Aa #FFDB92 on #DB6D24 2.54:1 Fail
Aa #DBB6B6 on #926D6D 2.46:1 Fail
Aa #926D6D on #6D2424 2.40:1 Fail
Aa #6D4949 on #DB6D24 2.31:1 Fail
Aa #B69292 on #B62424 2.30:1 Fail
Aa #FFFFB6 on #FF9224 2.15:1 Fail
Aa #B69292 on #FFDB92 2.10:1 Fail
Aa #926D6D on #FF9224 2.03:1 Fail
Aa #6D2424 on #000000 1.93:1 Fail
Aa #DB6D24 on #B62424 1.91:1 Fail
Aa #DBB6B6 on #DB6D24 1.83:1 Fail
Aa #DBB6B6 on #FFFFB6 1.78:1 Fail
Aa #926D6D on #6D4949 1.72:1 Fail
Aa #B62424 on #6D2424 1.69:1 Fail
Aa #FFDB92 on #FF9224 1.68:1 Fail
Aa #B69292 on #926D6D 1.62:1 Fail
Aa #DBB6B6 on #B69292 1.51:1 Fail
Aa #FF9224 on #DB6D24 1.51:1 Fail
Aa #926D6D on #B62424 1.42:1 Fail
Aa #6D4949 on #6D2424 1.40:1 Fail
Aa #DBB6B6 on #FFDB92 1.39:1 Fail
Aa #926D6D on #DB6D24 1.34:1 Fail
Aa #FFFFB6 on #FFDB92 1.28:1 Fail
Aa #B69292 on #FF9224 1.25:1 Fail
Aa #DBB6B6 on #FF9224 1.21:1 Fail
Aa #B69292 on #DB6D24 1.21:1 Fail
Aa #6D4949 on #B62424 1.21: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