命名颜色 · #C8B165
Split Pea Soup
Split Pea Soup 即 #C8B165:rgb(200 177 101)、hsl(46 47% 59%)、oklch(0.764 0.1 93)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Yellow mean? → · Split Pea Soup color name →
#C8B165
oklch(0.764 0.1 93)
颜色转换
- HEX
- #c8b165
- RGB
- rgb(200 177 101)
- HSL
- hsl(46 47% 59%)
- HWB
- hwb(46 40% 22%)
- OKLCH
- oklch(0.764 0.1 93)
- OKLab
- oklab(0.764 -0.005 0.1)
- CIE Lab
- lab(73 1.28 41.76)
- LCH
- lch(73 41.78 88.3)
- CMYK
- cmyk(0% 12% 50% 22%)
浅色调 · 深色调 · 灰色调
浅色调
- CDB975
- D3C185
- D8C895
- DED0A4
- E3D8B3
- E9E0C3
- EEE8D2
- F4EFE1
- F9F7F0
深色调
- AE9957
- 948349
- 7B6C3C
- 63572F
- 4C4222
- 362F17
- 211C0C
- 0F0C03
- 020100
灰色调
- C1AC69
- B9A76D
- B2A270
- AB9E73
- A39976
- 9C9478
- 958F7B
- 8E8A7D
- 87857E
配色和谐
互补色 +180°
- C8B165
Split Pea Soup
- 9DAEF2
≈ Wondrous Wisteria
类似色 -30° +30°
- C8B165
Split Pea Soup
- E0A46E
≈ Gehenna’s Gold
- A6BD75
≈ Tan Green
三角配色 +120° +240°
- C8B165
Split Pea Soup
- 5CC3D8
≈ Naxos Sky
- D99BCE
≈ Girl Power
分裂互补色 +150° +210°
- C8B165
Split Pea Soup
- 78BAED
≈ Aero
- BFA3E7
≈ Silver Rust
四角配色 +90° +180° +270°
- C8B165
Split Pea Soup
- 5FC7B8
≈ Cockatoo
- 9DAEF2
≈ Wondrous Wisteria
- E897AC
≈ Second Blush
对比度与无障碍
Ag
Fail白底
WCAG 2.11:1 · APCA Lc 41
Ag
AAA黑底
WCAG 9.93:1 · APCA Lc 61
最佳文字颜色: #000000
WCAG 9.93:1 (AAA) · APCA Lc 61
Contrast pairs
代码片段
CSS
:root {
--split-pea-soup: #c8b165;
--split-pea-soup-rgb: 200 177 101;
--split-pea-soup-oklch: oklch(0.764 0.1 93);
}
.element {
color: var(--split-pea-soup);
background-color: hsl(46 47% 59%);
border-color: oklch(0.764 0.1 93);
}Tailwind CSS v4
@theme {
--color-split-pea-soup: #c8b165;
--color-split-pea-soup-50: #fef6d6;
--color-split-pea-soup-100: #f2e8c3;
--color-split-pea-soup-200: #e1d5a4;
--color-split-pea-soup-300: #c7b77c;
--color-split-pea-soup-400: #b39d56;
--color-split-pea-soup-500: #9d842b;
--color-split-pea-soup-600: #857026;
--color-split-pea-soup-700: #6a591e;
--color-split-pea-soup-800: #4f4114;
--color-split-pea-soup-900: #372d0c;
--color-split-pea-soup-950: #221a01;
}SCSS
$split-pea-soup: #c8b165;
$split-pea-soup-rgb: 200, 177, 101;
$split-pea-soup-light: mix(#fff, $split-pea-soup, 20%);
$split-pea-soup-dark: mix(#000, $split-pea-soup, 20%);
.element {
color: $split-pea-soup;
box-shadow: 0 0 0 2px rgba($split-pea-soup, 0.35);
}