命名颜色 · #CB7D6F
Canyon Clay
Canyon Clay 即 #CB7D6F：rgb(203 125 111)、hsl(9 47% 62%)、oklch(0.669 0.1 30.9)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Red mean? → · Canyon Clay color name →
#CB7D6F
oklch(0.669 0.1 30.9)
颜色转换
- HEX
- #cb7d6f
- RGB
- rgb(203 125 111)
- HSL
- hsl(9 47% 62%)
- HWB
- hwb(9 44% 20%)
- OKLCH
- oklch(0.669 0.1 30.9)
- OKLab
- oklab(0.669 0.086 0.051)
- CIE Lab
- lab(60.74 29.97 21.13)
- LCH
- lch(60.74 36.67 35.2)
- CMYK
- cmyk(0% 38% 45% 20%)
浅色调 · 深色调 · 灰色调
浅色调
- D18A7D
- D7978B
- DDA499
- E2B1A7
- E8BDB5
- EDCAC4
- F2D7D2
- F6E5E1
- FBF2F0
深色调
- B06C60
- 965B51
- 7D4B42
- 653B34
- 4D2C27
- 371E1A
- 22110E
- 0F0504
- 020101
灰色调
- C47E71
- BD7E73
- B57F75
- AE7F76
- A78078
- 9F807A
- 98807B
- 90807D
- 88807F
配色和谐
互补色 +180°
- CB7D6F
Canyon Clay
- 37A5B8
≈ Sparkling Cove
类似色 -30° +30°
- CB7D6F
Canyon Clay
- C87A91
≈ Watermelon Pink
- C28652
≈ Butter Rum
三角配色 +120° +240°
- CB7D6F
Canyon Clay
- 65A775
≈ Aqua Forest
- 7E91D3
≈ Mood Mode
分裂互补色 +150° +210°
- CB7D6F
Canyon Clay
- 3EA998
≈ Jewel Weed
- 589DCD
≈ Blue Iguana
四角配色 +90° +180° +270°
- CB7D6F
Canyon Clay
- 8C9E56
≈ Yanagizome Green
- 37A5B8
≈ Sparkling Cove
- 9F86C9
≈ Lilac Purple
对比度与无障碍
Ag
Fail白底
WCAG 3.13:1 · APCA Lc 58
Ag
AA黑底
WCAG 6.70:1 · APCA Lc 44
最佳文字颜色: #000000
WCAG 6.70:1 (AA) · APCA Lc 44
Contrast pairs
代码片段
CSS
:root {
--canyon-clay: #cb7d6f;
--canyon-clay-rgb: 203 125 111;
--canyon-clay-oklch: oklch(0.669 0.1 30.9);
}
.element {
color: var(--canyon-clay);
background-color: hsl(9 47% 62%);
border-color: oklch(0.669 0.1 30.9);
}Tailwind CSS v4
@theme {
--color-canyon-clay: #cb7d6f;
--color-canyon-clay-50: #ffece3;
--color-canyon-clay-100: #ffddd3;
--color-canyon-clay-200: #fcc5b9;
--color-canyon-clay-300: #e6a597;
--color-canyon-clay-400: #d3887a;
--color-canyon-clay-500: #bf6b5d;
--color-canyon-clay-600: #a25b4f;
--color-canyon-clay-700: #82493f;
--color-canyon-clay-800: #60342e;
--color-canyon-clay-900: #44241f;
--color-canyon-clay-950: #2b120f;
}SCSS
$canyon-clay: #cb7d6f;
$canyon-clay-rgb: 203, 125, 111;
$canyon-clay-light: mix(#fff, $canyon-clay, 20%);
$canyon-clay-dark: mix(#000, $canyon-clay, 20%);
.element {
color: $canyon-clay;
box-shadow: 0 0 0 2px rgba($canyon-clay, 0.35);
}