命名颜色 · #DAEFCE
Seafoam Spray
Seafoam Spray 即 #DAEFCE：rgb(218 239 206)、hsl(98 51% 87%)、oklch(0.928 0.049 134.1)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Green mean? → · Seafoam Spray color name →
#DAEFCE
oklch(0.928 0.049 134.1)
颜色转换
- HEX
- #daefce
- RGB
- rgb(218 239 206)
- HSL
- hsl(98 51% 87%)
- HWB
- hwb(98 81% 6%)
- OKLCH
- oklch(0.928 0.049 134.1)
- OKLab
- oklab(0.928 -0.034 0.035)
- CIE Lab
- lab(92.23 -11.54 13.57)
- LCH
- lch(92.23 17.82 130.4)
- CMYK
- cmyk(9% 0% 14% 6%)
浅色调 · 深色调 · 灰色调
浅色调
- DEF1D3
- E1F2D8
- E5F4DD
- E9F5E2
- ECF7E7
- F0F9EB
- F4FAF0
- F8FCF5
- FBFDFA
深色调
- BDD0B3
- A2B198
- 87947F
- 6C7866
- 545C4E
- 3C4238
- 252A23
- 11140F
- 020302
灰色调
- D1E3C6
- C7D8BE
- BECCB6
- B5C1AE
- ACB6A6
- A3AB9F
- 9AA097
- 91958F
- 898B88
配色和谐
互补色 +180°
- DAEFCE
Seafoam Spray
- F3DEFF
≈ Lavender Savour
类似色 -30° +30°
- DAEFCE
Seafoam Spray
- ECE9C4
≈ Pale Celery
- CAF2DE
≈ Greenish White
三角配色 +120° +240°
- DAEFCE
Seafoam Spray
- D8E9FF
≈ Veiling Waterfalls
- FFDEE0
≈ Sweet Mallow
分裂互补色 +150° +210°
- DAEFCE
Seafoam Spray
- E4E5FF
≈ Lavender Mist
- FFDBEF
≈ Rose Glow
四角配色 +90° +180° +270°
- DAEFCE
Seafoam Spray
- C6EFFF
≈ Heaven’s Gate
- F3DEFF
≈ Lavender Savour
- FFE0D2
≈ Light Quilt
对比度与无障碍
Ag
Fail白底
WCAG 1.21:1 · APCA Lc 11
Ag
AAA黑底
WCAG 17.21:1 · APCA Lc 93
最佳文字颜色: #000000
WCAG 17.21:1 (AAA) · APCA Lc 93
Contrast pairs
代码片段
CSS
:root {
--seafoam-spray: #daefce;
--seafoam-spray-rgb: 218 239 206;
--seafoam-spray-oklch: oklch(0.928 0.049 134.1);
}
.element {
color: var(--seafoam-spray);
background-color: hsl(98 51% 87%);
border-color: oklch(0.928 0.049 134.1);
}Tailwind CSS v4
@theme {
--color-seafoam-spray: #daefce;
--color-seafoam-spray-50: #eff9eb;
--color-seafoam-spray-100: #e1ecdc;
--color-seafoam-spray-200: #cbd9c5;
--color-seafoam-spray-300: #acbea5;
--color-seafoam-spray-400: #93a588;
--color-seafoam-spray-500: #798e6d;
--color-seafoam-spray-600: #66785c;
--color-seafoam-spray-700: #526049;
--color-seafoam-spray-800: #3c4634;
--color-seafoam-spray-900: #293124;
--color-seafoam-spray-950: #171d13;
}SCSS
$seafoam-spray: #daefce;
$seafoam-spray-rgb: 218, 239, 206;
$seafoam-spray-light: mix(#fff, $seafoam-spray, 20%);
$seafoam-spray-dark: mix(#000, $seafoam-spray, 20%);
.element {
color: $seafoam-spray;
box-shadow: 0 0 0 2px rgba($seafoam-spray, 0.35);
}