命名颜色 · #D4E8D8
Splashdown
Splashdown 即 #D4E8D8：rgb(212 232 216)、hsl(132 30% 87%)、oklch(0.912 0.03 151.5)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · Splashdown color name →
#D4E8D8
oklch(0.912 0.03 151.5)
颜色转换
- HEX
- #d4e8d8
- RGB
- rgb(212 232 216)
- HSL
- hsl(132 30% 87%)
- HWB
- hwb(132 83% 9%)
- OKLCH
- oklch(0.912 0.03 151.5)
- OKLab
- oklab(0.912 -0.027 0.014)
- CIE Lab
- lab(90.17 -9.07 5.43)
- LCH
- lch(90.17 10.57 149.1)
- CMYK
- cmyk(9% 0% 7% 9%)
浅色调 · 深色调 · 灰色调
浅色调
- D8EADC
- DDEDE0
- E1EFE4
- E5F1E7
- E9F3EB
- EEF6EF
- F2F8F3
- F6FAF7
- FBFDFB
深色调
- B8CABC
- 9DACA0
- 839085
- 69746B
- 515953
- 3A403B
- 242925
- 101311
- 020302
灰色调
- CBDDCF
- C3D2C6
- BAC8BD
- B2BDB4
- A9B3AB
- A1A8A2
- 989E9A
- 909491
- 888A88
配色和谐
互补色 +180°
- D4E8D8
Splashdown
- EEDBEB
≈ Maiden of the Mist
类似色 -30° +30°
- D4E8D8
Splashdown
- DEE5CF
≈ Willow Brook
- CDE9E3
≈ Frosty White Blue
三角配色 +120° +240°
- D4E8D8
Splashdown
- DAE1F7
≈ Aquarelle Purple
- F5DBD6
≈ Rosewater
分裂互补色 +150° +210°
- D4E8D8
Splashdown
- E5DEF3
≈ Lingering Lilac
- F4DAE0
≈ Fancy Pants
四角配色 +90° +180° +270°
- D4E8D8
Splashdown
- D1E5F5
≈ New Heights
- EEDBEB
≈ Maiden of the Mist
- F1DECE
≈ Siren Song
对比度与无障碍
Ag
Fail白底
WCAG 1.28:1 · APCA Lc 14
Ag
AAA黑底
WCAG 16.33:1 · APCA Lc 90
最佳文字颜色: #000000
WCAG 16.33:1 (AAA) · APCA Lc 90
Contrast pairs
代码片段
CSS
:root {
--splashdown: #d4e8d8;
--splashdown-rgb: 212 232 216;
--splashdown-oklch: oklch(0.912 0.03 151.5);
}
.element {
color: var(--splashdown);
background-color: hsl(132 30% 87%);
border-color: oklch(0.912 0.03 151.5);
}Tailwind CSS v4
@theme {
--color-splashdown: #d4e8d8;
--color-splashdown-50: #eff8f1;
--color-splashdown-100: #e1ebe3;
--color-splashdown-200: #cbd8ce;
--color-splashdown-300: #acbcb0;
--color-splashdown-400: #92a496;
--color-splashdown-500: #788c7c;
--color-splashdown-600: #667769;
--color-splashdown-700: #515f54;
--color-splashdown-800: #3b453d;
--color-splashdown-900: #29302a;
--color-splashdown-950: #171c17;
}SCSS
$splashdown: #d4e8d8;
$splashdown-rgb: 212, 232, 216;
$splashdown-light: mix(#fff, $splashdown, 20%);
$splashdown-dark: mix(#000, $splashdown, 20%);
.element {
color: $splashdown;
box-shadow: 0 0 0 2px rgba($splashdown, 0.35);
}