最接近的命名颜色 · #DFC2DA
#DFC2DA
最接近的命名颜色: Sweet Dreams
#DFC2DA（rgb(223 194 218)、hsl(310 31% 82%)、oklch(0.846 0.046 331.7)）最接近命名颜色 Sweet Dreams。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#DFC2DA
oklch(0.846 0.046 331.7)
颜色转换
- HEX
- #dfc2da
- RGB
- rgb(223 194 218)
- HSL
- hsl(310 31% 82%)
- HWB
- hwb(310 76% 13%)
- OKLCH
- oklch(0.846 0.046 331.7)
- OKLab
- oklab(0.846 0.04 -0.022)
- CIE Lab
- lab(81.48 13.66 -8.04)
- LCH
- lch(81.48 15.85 329.5)
- CMYK
- cmyk(0% 13% 2% 13%)
浅色调 · 深色调 · 灰色调
浅色调
- E2C8DE
- E6CEE1
- E9D4E5
- ECDAE9
- EFE0EC
- F2E6F0
- F6ECF4
- F9F3F8
- FCF9FB
深色调
- C2A8BD
- A58FA2
- 8A7787
- 6F606C
- 564954
- 3D343C
- 272025
- 120E11
- 020202
灰色调
- D5BBD1
- CBB4C7
- C2AEBE
- B8A7B5
- AEA0AC
- A59AA3
- 9C939A
- 928D91
- 898689
配色和谐
互补色 +180°
- DFC2DA
Sweet Dreams
- B7D5BE
≈ Surf
类似色 -30° +30°
- DFC2DA
Sweet Dreams
- D1C6E6
≈ Italian Fitch
- E7C1CA
≈ Primrose Pink
三角配色 +120° +240°
- DFC2DA
Sweet Dreams
- D7CCAB
≈ Dance With the Wind
- ABD5DE
≈ Light Sea Spray
分裂互补色 +150° +210°
- DFC2DA
Sweet Dreams
- C7D2B1
≈ Hidden Hills
- ACD7CE
≈ Scandal
四角配色 +90° +180° +270°
- DFC2DA
Sweet Dreams
- E3C6AF
≈ Cockleshell
- B7D5BE
≈ Surf
- B3D1E8
≈ Chapel Blue
对比度与无障碍
Ag
Fail白底
WCAG 1.63:1 · APCA Lc 28
Ag
AAA黑底
WCAG 12.86:1 · APCA Lc 75
最佳文字颜色: #000000
WCAG 12.86:1 (AAA) · APCA Lc 75
Contrast pairs
代码片段
CSS
:root {
--sweet-dreams: #dfc2da;
--sweet-dreams-rgb: 223 194 218;
--sweet-dreams-oklch: oklch(0.846 0.046 331.7);
}
.element {
color: var(--sweet-dreams);
background-color: hsl(310 31% 82%);
border-color: oklch(0.846 0.046 331.7);
}Tailwind CSS v4
@theme {
--color-sweet-dreams: #dfc2da;
--color-sweet-dreams-50: #fef1fb;
--color-sweet-dreams-100: #f2e2ee;
--color-sweet-dreams-200: #e1cddc;
--color-sweet-dreams-300: #c7afc1;
--color-sweet-dreams-400: #af95ab;
--color-sweet-dreams-500: #997b94;
--color-sweet-dreams-600: #81697d;
--color-sweet-dreams-700: #675364;
--color-sweet-dreams-800: #4c3d4a;
--color-sweet-dreams-900: #352a33;
--color-sweet-dreams-950: #20171f;
}SCSS
$sweet-dreams: #dfc2da;
$sweet-dreams-rgb: 223, 194, 218;
$sweet-dreams-light: mix(#fff, $sweet-dreams, 20%);
$sweet-dreams-dark: mix(#000, $sweet-dreams, 20%);
.element {
color: $sweet-dreams;
box-shadow: 0 0 0 2px rgba($sweet-dreams, 0.35);
}