Named color · #C8A397
Naked Clay
Naked Clay is #C8A397: rgb(200 163 151), hsl(15 31% 69%), oklch(0.746 0.047 38.7). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Red mean? → · Naked Clay color name →
#C8A397
oklch(0.746 0.047 38.7)
Color conversions
- HEX
- #c8a397
- RGB
- rgb(200 163 151)
- HSL
- hsl(15 31% 69%)
- HWB
- hwb(15 59% 22%)
- OKLCH
- oklch(0.746 0.047 38.7)
- OKLab
- oklab(0.746 0.037 0.03)
- CIE Lab
- lab(70.16 12.72 11.66)
- LCH
- lch(70.16 17.26 42.5)
- CMYK
- cmyk(0% 19% 25% 22%)
Tints · Shades · Tones
Tints
- CEACA1
- D3B5AB
- D9BEB5
- DEC7C0
- E4D0CA
- E9DAD4
- EFE3DF
- F4ECEA
- FAF6F4
Shades
- AE8D83
- 94786F
- 7B635C
- 634F49
- 4C3C37
- 362A26
- 211917
- 0F0A08
- 020101
Tones
- C19F95
- B99C92
- B29890
- AB958E
- A4918C
- 9D8E89
- 958A87
- 8E8785
- 878382
Color harmonies
Complementary +180°
- C8A397
Naked Clay
- 8CB4C1
≈ Thistleblossom Soft Blue
Analogous -30° +30°
- C8A397
Naked Clay
- C8A1A6
≈ Lighthearted Rose
- C1A88D
≈ 3AM Latte
Triadic +120° +240°
- C8A397
Naked Clay
- 94B6A2
≈ Garden District
- A5AACB
≈ Wisteria Light Soft Blue
Split-complementary +150° +210°
- C8A397
Naked Clay
- 8BB7B2
≈ Vintage Blue
- 96B0CA
≈ Porcelain Vase
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 2.29:1 · APCA Lc 45
Ag
AAAOn black
WCAG 9.14:1 · APCA Lc 57
Best text color: #000000
WCAG 9.14:1 (AAA) · APCA Lc 57
Contrast pairs
Code snippets
CSS
:root {
--naked-clay: #c8a397;
--naked-clay-rgb: 200 163 151;
--naked-clay-oklch: oklch(0.746 0.047 38.7);
}
.element {
color: var(--naked-clay);
background-color: hsl(15 31% 69%);
border-color: oklch(0.746 0.047 38.7);
}Tailwind CSS v4
@theme {
--color-naked-clay: #c8a397;
--color-naked-clay-50: #fff1eb;
--color-naked-clay-100: #f7e3dc;
--color-naked-clay-200: #e7cec5;
--color-naked-clay-300: #ceb0a5;
--color-naked-clay-400: #b8958a;
--color-naked-clay-500: #a27c6f;
--color-naked-clay-600: #89695e;
--color-naked-clay-700: #6e544b;
--color-naked-clay-800: #513d37;
--color-naked-clay-900: #392a26;
--color-naked-clay-950: #231714;
}SCSS
$naked-clay: #c8a397;
$naked-clay-rgb: 200, 163, 151;
$naked-clay-light: mix(#fff, $naked-clay, 20%);
$naked-clay-dark: mix(#000, $naked-clay, 20%);
.element {
color: $naked-clay;
box-shadow: 0 0 0 2px rgba($naked-clay, 0.35);
}