命名颜色 · #C8A397
Naked Clay
Naked Clay 即 #C8A397：rgb(200 163 151)、hsl(15 31% 69%)、oklch(0.746 0.047 38.7)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Red mean? → · Naked Clay color name →
#C8A397
oklch(0.746 0.047 38.7)
颜色转换
- 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%)
浅色调 · 深色调 · 灰色调
浅色调
- CEACA1
- D3B5AB
- D9BEB5
- DEC7C0
- E4D0CA
- E9DAD4
- EFE3DF
- F4ECEA
- FAF6F4
深色调
- AE8D83
- 94786F
- 7B635C
- 634F49
- 4C3C37
- 362A26
- 211917
- 0F0A08
- 020101
灰色调
- C19F95
- B99C92
- B29890
- AB958E
- A4918C
- 9D8E89
- 958A87
- 8E8785
- 878382
配色和谐
互补色 +180°
- C8A397
Naked Clay
- 8CB4C1
≈ Thistleblossom Soft Blue
类似色 -30° +30°
- C8A397
Naked Clay
- C8A1A6
≈ Lighthearted Rose
- C1A88D
≈ 3AM Latte
三角配色 +120° +240°
- C8A397
Naked Clay
- 94B6A2
≈ Garden District
- A5AACB
≈ Wisteria Light Soft Blue
分裂互补色 +150° +210°
- C8A397
Naked Clay
- 8BB7B2
≈ Vintage Blue
- 96B0CA
≈ Porcelain Vase
四角配色 +90° +180° +270°
对比度与无障碍
Ag
Fail白底
WCAG 2.29:1 · APCA Lc 45
Ag
AAA黑底
WCAG 9.14:1 · APCA Lc 57
最佳文字颜色: #000000
WCAG 9.14:1 (AAA) · APCA Lc 57
Contrast pairs
代码片段
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);
}