Red Rock Canyon Color Palette
High-noon in red-rock country: sandstone and clay, sienna and terracotta canyon walls, dusty sage scrub, and a hazy mauve sky. Warm and sunbaked but daylit rather than dusk, the southwestern counterpart to a desert sunset. For canyon landscapes, southwestern and adobe design, and earthy travel branding.
Get Paintrix free on the App Store.
Download
Hex codes
Color theory
Base
Complement
Analogous −30°
Analogous +30°
Triadic
Use it for
Code formats
CSS
:root {
--desert-canyon-1: #EFD9B6;
--desert-canyon-2: #E4C89F;
--desert-canyon-3: #D7B587;
--desert-canyon-4: #C8A06F;
--desert-canyon-5: #B78B58;
--desert-canyon-6: #A47645;
--desert-canyon-7: #C16A45;
--desert-canyon-8: #B25C3B;
--desert-canyon-9: #A24F33;
--desert-canyon-10: #90432B;
--desert-canyon-11: #7C3824;
--desert-canyon-12: #682D1D;
--desert-canyon-13: #B5573F;
--desert-canyon-14: #A44C37;
--desert-canyon-15: #92412F;
--desert-canyon-16: #7F3727;
--desert-canyon-17: #6B2D20;
--desert-canyon-18: #572319;
--desert-canyon-19: #9AA37A;
--desert-canyon-20: #8A946C;
--desert-canyon-21: #79845E;
--desert-canyon-22: #697451;
--desert-canyon-23: #596344;
--desert-canyon-24: #495337;
--desert-canyon-25: #C9A8A0;
--desert-canyon-26: #B8958D;
--desert-canyon-27: #A6837B;
--desert-canyon-28: #917069;
--desert-canyon-29: #7C5E57;
--desert-canyon-30: #664C46;
} SCSS
$desert-canyon-1: #EFD9B6;
$desert-canyon-2: #E4C89F;
$desert-canyon-3: #D7B587;
$desert-canyon-4: #C8A06F;
$desert-canyon-5: #B78B58;
$desert-canyon-6: #A47645;
$desert-canyon-7: #C16A45;
$desert-canyon-8: #B25C3B;
$desert-canyon-9: #A24F33;
$desert-canyon-10: #90432B;
$desert-canyon-11: #7C3824;
$desert-canyon-12: #682D1D;
$desert-canyon-13: #B5573F;
$desert-canyon-14: #A44C37;
$desert-canyon-15: #92412F;
$desert-canyon-16: #7F3727;
$desert-canyon-17: #6B2D20;
$desert-canyon-18: #572319;
$desert-canyon-19: #9AA37A;
$desert-canyon-20: #8A946C;
$desert-canyon-21: #79845E;
$desert-canyon-22: #697451;
$desert-canyon-23: #596344;
$desert-canyon-24: #495337;
$desert-canyon-25: #C9A8A0;
$desert-canyon-26: #B8958D;
$desert-canyon-27: #A6837B;
$desert-canyon-28: #917069;
$desert-canyon-29: #7C5E57;
$desert-canyon-30: #664C46; Tailwind
// tailwind.config.js
module.exports = {
theme: {
extend: {
colors: {
'desert-canyon': {
'1': '#EFD9B6',
'2': '#E4C89F',
'3': '#D7B587',
'4': '#C8A06F',
'5': '#B78B58',
'6': '#A47645',
'7': '#C16A45',
'8': '#B25C3B',
'9': '#A24F33',
'10': '#90432B',
'11': '#7C3824',
'12': '#682D1D',
'13': '#B5573F',
'14': '#A44C37',
'15': '#92412F',
'16': '#7F3727',
'17': '#6B2D20',
'18': '#572319',
'19': '#9AA37A',
'20': '#8A946C',
'21': '#79845E',
'22': '#697451',
'23': '#596344',
'24': '#495337',
'25': '#C9A8A0',
'26': '#B8958D',
'27': '#A6837B',
'28': '#917069',
'29': '#7C5E57',
'30': '#664C46',
},
},
},
},
}; JSON
{
"name": "Red Rock Canyon",
"colors": [
"#EFD9B6",
"#E4C89F",
"#D7B587",
"#C8A06F",
"#B78B58",
"#A47645",
"#C16A45",
"#B25C3B",
"#A24F33",
"#90432B",
"#7C3824",
"#682D1D",
"#B5573F",
"#A44C37",
"#92412F",
"#7F3727",
"#6B2D20",
"#572319",
"#9AA37A",
"#8A946C",
"#79845E",
"#697451",
"#596344",
"#495337",
"#C9A8A0",
"#B8958D",
"#A6837B",
"#917069",
"#7C5E57",
"#664C46"
]
} Hex list
#EFD9B6
#E4C89F
#D7B587
#C8A06F
#B78B58
#A47645
#C16A45
#B25C3B
#A24F33
#90432B
#7C3824
#682D1D
#B5573F
#A44C37
#92412F
#7F3727
#6B2D20
#572319
#9AA37A
#8A946C
#79845E
#697451
#596344
#495337
#C9A8A0
#B8958D
#A6837B
#917069
#7C5E57
#664C46