Named color · #AE895D
Clay Ochre
Clay Ochre is #AE895D: rgb(174 137 93), hsl(33 33% 52%), oklch(0.655 0.075 70.7). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Orange mean? → · Clay Ochre color name →
#AE895D
oklch(0.655 0.075 70.7)
Color conversions
- HEX
- #ae895d
- RGB
- rgb(174 137 93)
- HSL
- hsl(33 33% 52%)
- HWB
- hwb(33 36% 32%)
- OKLCH
- oklch(0.655 0.075 70.7)
- OKLab
- oklab(0.655 0.025 0.071)
- CIE Lab
- lab(59.9 10.34 29.21)
- LCH
- lch(59.9 30.99 70.5)
- CMYK
- cmyk(0% 21% 47% 32%)
Tints · Shades · Tones
Tints
- B6946D
- BEA07D
- C6AC8D
- CEB79D
- D7C3AD
- DFCFBD
- E7DBCD
- EFE7DE
- F7F3EE
Shades
- 977650
- 806443
- 6A5337
- 55422A
- 41311F
- 2E2214
- 1C140A
- 0B0703
- 010100
Tones
- A98861
- A58765
- A08769
- 9C866D
- 978570
- 938473
- 8E8377
- 89827A
- 85817D
Color harmonies
Complementary +180°
- AE895D
Clay Ochre
- 6E94BD
≈ Blue Tuna
Analogous -30° +30°
- AE895D
Clay Ochre
- B9816D
≈ Western Pink
- 9B925B
≈ Tirol
Triadic +120° +240°
- AE895D
Clay Ochre
- 559F9B
≈ Caulerpa Lentillifera
- 9F84B3
≈ Peony Mauve
Split-complementary +150° +210°
- AE895D
Clay Ochre
- 599BB1
≈ Chivalry
- 888CBE
≈ Soft Blue Lavender
Tetradic +90° +180° +270°
- AE895D
Clay Ochre
- 669F82
≈ Sea Lettuce
- 6E94BD
≈ Blue Tuna
- B07F9F
≈ Antique Hot Pink
Contrast & accessibility
Ag
FailOn white
WCAG 3.21:1 · APCA Lc 59
Ag
AAOn black
WCAG 6.53:1 · APCA Lc 42
Best text color: #000000
WCAG 6.53:1 (AA) · APCA Lc 42
Contrast pairs
Code snippets
CSS
:root {
--clay-ochre: #ae895d;
--clay-ochre-rgb: 174 137 93;
--clay-ochre-oklch: oklch(0.655 0.075 70.7);
}
.element {
color: var(--clay-ochre);
background-color: hsl(33 33% 52%);
border-color: oklch(0.655 0.075 70.7);
}Tailwind CSS v4
@theme {
--color-clay-ochre: #ae895d;
--color-clay-ochre-50: #fff2de;
--color-clay-ochre-100: #f8e5cd;
--color-clay-ochre-200: #e8d0b2;
--color-clay-ochre-300: #cfb28d;
--color-clay-ochre-400: #bb976d;
--color-clay-ochre-500: #a67e4d;
--color-clay-ochre-600: #8c6a42;
--color-clay-ochre-700: #705534;
--color-clay-ochre-800: #533e25;
--color-clay-ochre-900: #3a2a19;
--color-clay-ochre-950: #241809;
}SCSS
$clay-ochre: #ae895d;
$clay-ochre-rgb: 174, 137, 93;
$clay-ochre-light: mix(#fff, $clay-ochre, 20%);
$clay-ochre-dark: mix(#000, $clay-ochre, 20%);
.element {
color: $clay-ochre;
box-shadow: 0 0 0 2px rgba($clay-ochre, 0.35);
}