命名颜色 · #DBB486
Butterscotch Sundae
Butterscotch Sundae 即 #DBB486：rgb(219 180 134)、hsl(32 54% 69%)、oklch(0.794 0.076 71)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · Butterscotch Sundae color name →
#DBB486
oklch(0.794 0.076 71)
颜色转换
- HEX
- #dbb486
- RGB
- rgb(219 180 134)
- HSL
- hsl(32 54% 69%)
- HWB
- hwb(32 53% 14%)
- OKLCH
- oklch(0.794 0.076 71)
- OKLab
- oklab(0.794 0.025 0.072)
- CIE Lab
- lab(76.02 10.01 29.08)
- LCH
- lch(76.02 30.75 71)
- CMYK
- cmyk(0% 18% 39% 14%)
浅色调 · 深色调 · 灰色调
浅色调
- DFBB92
- E3C39E
- E6CAAA
- EAD2B6
- EDD9C2
- F1E1CE
- F5E8DB
- F8F0E7
- FCF7F3
深色调
- BE9C74
- A28562
- 876E51
- 6D5840
- 544430
- 3C3021
- 261D13
- 110C06
- 020201
灰色调
- D2AF86
- C8AA86
- BFA485
- B69F85
- AD9A84
- A49584
- 9B9083
- 928A82
- 898581
配色和谐
互补色 +180°
- DBB486
Butterscotch Sundae
- 98C0EB
≈ Salvia Blue
类似色 -30° +30°
- DBB486
Butterscotch Sundae
- E7AC96
≈ Pale Terra
- C6BE85
≈ Wheat Grass
三角配色 +120° +240°
- DBB486
Butterscotch Sundae
- 80CCC7
≈ Blue Green Gem
- CBAEE0
≈ Lavender Field Dreamer
分裂互补色 +150° +210°
- DBB486
Butterscotch Sundae
- 83C7DE
≈ Winter Chime
- B2B7EC
≈ Perano
四角配色 +90° +180° +270°
- DBB486
Butterscotch Sundae
- 90CBAC
≈ Peppermint Spray
- 98C0EB
≈ Salvia Blue
- DEA9CA
≈ Aristocratic Pink
对比度与无障碍
Ag
Fail白底
WCAG 1.92:1 · APCA Lc 37
Ag
AAA黑底
WCAG 10.88:1 · APCA Lc 66
最佳文字颜色: #000000
WCAG 10.88:1 (AAA) · APCA Lc 66
Contrast pairs
代码片段
CSS
:root {
--butterscotch-sundae: #dbb486;
--butterscotch-sundae-rgb: 219 180 134;
--butterscotch-sundae-oklch: oklch(0.794 0.076 71);
}
.element {
color: var(--butterscotch-sundae);
background-color: hsl(32 54% 69%);
border-color: oklch(0.794 0.076 71);
}Tailwind CSS v4
@theme {
--color-butterscotch-sundae: #dbb486;
--color-butterscotch-sundae-50: #fff2de;
--color-butterscotch-sundae-100: #f8e5cd;
--color-butterscotch-sundae-200: #e9d0b1;
--color-butterscotch-sundae-300: #d0b28d;
--color-butterscotch-sundae-400: #bb976d;
--color-butterscotch-sundae-500: #a67e4c;
--color-butterscotch-sundae-600: #8c6a41;
--color-butterscotch-sundae-700: #705533;
--color-butterscotch-sundae-800: #543e24;
--color-butterscotch-sundae-900: #3a2a18;
--color-butterscotch-sundae-950: #241809;
}SCSS
$butterscotch-sundae: #dbb486;
$butterscotch-sundae-rgb: 219, 180, 134;
$butterscotch-sundae-light: mix(#fff, $butterscotch-sundae, 20%);
$butterscotch-sundae-dark: mix(#000, $butterscotch-sundae, 20%);
.element {
color: $butterscotch-sundae;
box-shadow: 0 0 0 2px rgba($butterscotch-sundae, 0.35);
}