命名颜色 · #D0A569
Campground
Campground 即 #D0A569:rgb(208 165 105)、hsl(35 52% 61%)、oklch(0.748 0.093 74.8)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · Campground color name →
#D0A569
oklch(0.748 0.093 74.8)
颜色转换
- HEX
- #d0a569
- RGB
- rgb(208 165 105)
- HSL
- hsl(35 52% 61%)
- HWB
- hwb(35 41% 18%)
- OKLCH
- oklch(0.748 0.093 74.8)
- OKLab
- oklab(0.748 0.024 0.089)
- CIE Lab
- lab(70.78 10.95 37.29)
- LCH
- lch(70.78 38.86 73.6)
- CMYK
- cmyk(0% 21% 50% 18%)
浅色调 · 深色调 · 灰色调
浅色调
- D5AE79
- DAB788
- DFC097
- E3C9A6
- E8D2B5
- EDDBC3
- F1E4D2
- F6EDE1
- FAF6F0
深色调
- B58F5A
- 9A794C
- 80653E
- 675131
- 4F3D24
- 392B18
- 231A0C
- 100A04
- 020100
灰色调
- C8A16C
- C09E6F
- B89A72
- B09775
- A89377
- A08F79
- 988B7B
- 90887D
- 88847F
配色和谐
互补色 +180°
- D0A569
Campground
- 85B0E7
≈ Queer Blue
类似色 -30° +30°
- D0A569
Campground
- DF9B7C
≈ Ciao
- B6B16A
≈ Rodham
三角配色 +120° +240°
- D0A569
Campground
- 5DC0BF
≈ Gem Turquoise
- C39CD6
≈ Mauve Mist
分裂互补色 +150° +210°
- D0A569
Campground
- 67BAD9
≈ Baby Tears
- A7A5E6
≈ Maximum Blue Purple
四角配色 +90° +180° +270°
- D0A569
Campground
- 72C09F
≈ Gem Silica
- 85B0E7
≈ Queer Blue
- D896BB
≈ Soft Fuchsia
对比度与无障碍
Ag
Fail白底
WCAG 2.26:1 · APCA Lc 45
Ag
AAA黑底
WCAG 9.26:1 · APCA Lc 58
最佳文字颜色: #000000
WCAG 9.26:1 (AAA) · APCA Lc 58
Contrast pairs
代码片段
CSS
:root {
--campground: #d0a569;
--campground-rgb: 208 165 105;
--campground-oklch: oklch(0.748 0.093 74.8);
}
.element {
color: var(--campground);
background-color: hsl(35 52% 61%);
border-color: oklch(0.748 0.093 74.8);
}Tailwind CSS v4
@theme {
--color-campground: #d0a569;
--color-campground-50: #fff2d8;
--color-campground-100: #fae5c6;
--color-campground-200: #ebd0a8;
--color-campground-300: #d2b282;
--color-campground-400: #bf975e;
--color-campground-500: #aa7d38;
--color-campground-600: #906a31;
--color-campground-700: #735427;
--color-campground-800: #563d1b;
--color-campground-900: #3c2a11;
--color-campground-950: #261704;
}SCSS
$campground: #d0a569;
$campground-rgb: 208, 165, 105;
$campground-light: mix(#fff, $campground, 20%);
$campground-dark: mix(#000, $campground, 20%);
.element {
color: $campground;
box-shadow: 0 0 0 2px rgba($campground, 0.35);
}