命名颜色 · #D7D3A6
Cream Cheese Avocado
Cream Cheese Avocado 即 #D7D3A6：rgb(215 211 166)、hsl(55 38% 75%)、oklch(0.859 0.06 103.3)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Yellow mean? → · Cream Cheese Avocado color name →
#D7D3A6
oklch(0.859 0.06 103.3)
颜色转换
- HEX
- #d7d3a6
- RGB
- rgb(215 211 166)
- HSL
- hsl(55 38% 75%)
- HWB
- hwb(55 65% 16%)
- OKLCH
- oklch(0.859 0.06 103.3)
- OKLab
- oklab(0.859 -0.014 0.058)
- CIE Lab
- lab(84.03 -3.9 22.92)
- LCH
- lch(84.03 23.24 99.7)
- CMYK
- cmyk(0% 2% 23% 16%)
浅色调 · 深色调 · 灰色调
浅色调
- DBD7AF
- DFDCB8
- E3E0C1
- E7E5CA
- EBE9D3
- EFEDDB
- F3F2E4
- F7F6ED
- FBFBF6
深色调
- BBB790
- 9F9C7A
- 858265
- 6B6951
- 52513E
- 3B3A2B
- 25241A
- 11100A
- 020201
灰色调
- CECAA2
- C5C29F
- BCB99B
- B3B197
- AAA993
- A2A090
- 99988C
- 919088
- 888884
配色和谐
互补色 +180°
- D7D3A6
Cream Cheese Avocado
- CBCCF7
≈ Lavender Blue
类似色 -30° +30°
- D7D3A6
Cream Cheese Avocado
- E9CBA6
≈ Autumn Blonde
- C1DAB2
≈ Wisp Green
三角配色 +120° +240°
- D7D3A6
Cream Cheese Avocado
- A6DAEE
≈ Mizu Cyan
- EEC2DB
≈ Starlet Pink
分裂互补色 +150° +210°
- D7D3A6
Cream Cheese Avocado
- B6D4F8
≈ Ice Cold Stare
- DFC6ED
≈ Prom Corsage
四角配色 +90° +180° +270°
- D7D3A6
Cream Cheese Avocado
- A3DEDB
≈ Aqua Spray
- CBCCF7
≈ Lavender Blue
- F5C1C5
≈ Plaza Pink
对比度与无障碍
Ag
Fail白底
WCAG 1.52:1 · APCA Lc 24
Ag
AAA黑底
WCAG 13.75:1 · APCA Lc 79
最佳文字颜色: #000000
WCAG 13.75:1 (AAA) · APCA Lc 79
Contrast pairs
代码片段
CSS
:root {
--cream-cheese-avocado: #d7d3a6;
--cream-cheese-avocado-rgb: 215 211 166;
--cream-cheese-avocado-oklch: oklch(0.859 0.06 103.3);
}
.element {
color: var(--cream-cheese-avocado);
background-color: hsl(55 38% 75%);
border-color: oklch(0.859 0.06 103.3);
}Tailwind CSS v4
@theme {
--color-cream-cheese-avocado: #d7d3a6;
--color-cream-cheese-avocado-50: #f7f7e3;
--color-cream-cheese-avocado-100: #eae9d3;
--color-cream-cheese-avocado-200: #d7d6b9;
--color-cream-cheese-avocado-300: #bbba97;
--color-cream-cheese-avocado-400: #a4a078;
--color-cream-cheese-avocado-500: #8d8859;
--color-cream-cheese-avocado-600: #77734c;
--color-cream-cheese-avocado-700: #5f5c3c;
--color-cream-cheese-avocado-800: #47432b;
--color-cream-cheese-avocado-900: #312e1d;
--color-cream-cheese-avocado-950: #1d1b0d;
}SCSS
$cream-cheese-avocado: #d7d3a6;
$cream-cheese-avocado-rgb: 215, 211, 166;
$cream-cheese-avocado-light: mix(#fff, $cream-cheese-avocado, 20%);
$cream-cheese-avocado-dark: mix(#000, $cream-cheese-avocado, 20%);
.element {
color: $cream-cheese-avocado;
box-shadow: 0 0 0 2px rgba($cream-cheese-avocado, 0.35);
}