命名颜色 · #D2BB79
Further Afield
Further Afield 即 #D2BB79:rgb(210 187 121)、hsl(44 50% 65%)、oklch(0.797 0.089 91)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Yellow mean? → · Further Afield color name →
#D2BB79
oklch(0.797 0.089 91)
颜色转换
- HEX
- #d2bb79
- RGB
- rgb(210 187 121)
- HSL
- hsl(44 50% 65%)
- HWB
- hwb(44 47% 18%)
- OKLCH
- oklch(0.797 0.089 91)
- OKLab
- oklab(0.797 -0.002 0.089)
- CIE Lab
- lab(76.75 1.83 36.53)
- LCH
- lch(76.75 36.58 87.1)
- CMYK
- cmyk(0% 11% 42% 18%)
浅色调 · 深色调 · 灰色调
浅色调
- D6C287
- DBC995
- DFCFA2
- E4D6AF
- E8DDBD
- EDE4CA
- F1EBD7
- F6F1E4
- FAF8F2
深色调
- B6A268
- 9B8A58
- 817348
- 685C39
- 50462B
- 39321D
- 241F10
- 100D05
- 020201
灰色调
- C9B57B
- C1AF7C
- B9A97D
- B0A37E
- A89D7F
- A0977F
- 989280
- 908C80
- 888680
配色和谐
互补色 +180°
- D2BB79
Further Afield
- A7BAF7
≈ Pastel Blue
类似色 -30° +30°
- D2BB79
Further Afield
- E7B082
≈ Soft Skills
- B4C685
≈ Gnome Green
三角配色 +120° +240°
- D2BB79
Further Afield
- 73CCDD
≈ Slick Blue
- DEA8D7
≈ Barely Bloomed
分裂互补色 +150° +210°
- D2BB79
Further Afield
- 88C4F1
≈ Wasurenagusa Blue
- C6B0ED
≈ Purple Sand
四角配色 +90° +180° +270°
- D2BB79
Further Afield
- 77D0C0
≈ Downy
- A7BAF7
≈ Pastel Blue
- EDA5B9
≈ Alien Conspiracy Pink
对比度与无障碍
Ag
Fail白底
WCAG 1.88:1 · APCA Lc 36
Ag
AAA黑底
WCAG 11.12:1 · APCA Lc 67
最佳文字颜色: #000000
WCAG 11.12:1 (AAA) · APCA Lc 67
Contrast pairs
代码片段
CSS
:root {
--further-afield: #d2bb79;
--further-afield-rgb: 210 187 121;
--further-afield-oklch: oklch(0.797 0.089 91);
}
.element {
color: var(--further-afield);
background-color: hsl(44 50% 65%);
border-color: oklch(0.797 0.089 91);
}Tailwind CSS v4
@theme {
--color-further-afield: #d2bb79;
--color-further-afield-50: #fef5d9;
--color-further-afield-100: #f2e8c7;
--color-further-afield-200: #e1d4aa;
--color-further-afield-300: #c7b783;
--color-further-afield-400: #b29d5f;
--color-further-afield-500: #9c843a;
--color-further-afield-600: #847032;
--color-further-afield-700: #6a5928;
--color-further-afield-800: #4f411b;
--color-further-afield-900: #372d11;
--color-further-afield-950: #221a04;
}SCSS
$further-afield: #d2bb79;
$further-afield-rgb: 210, 187, 121;
$further-afield-light: mix(#fff, $further-afield, 20%);
$further-afield-dark: mix(#000, $further-afield, 20%);
.element {
color: $further-afield;
box-shadow: 0 0 0 2px rgba($further-afield, 0.35);
}