命名颜色 · #E5F0D5
Spring Morn
Spring Morn 即 #E5F0D5:rgb(229 240 213)、hsl(84 47% 89%)、oklch(0.94 0.038 125.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Green mean? → · Spring Morn color name →
#E5F0D5
oklch(0.94 0.038 125.2)
颜色转换
- HEX
- #e5f0d5
- RGB
- rgb(229 240 213)
- HSL
- hsl(84 47% 89%)
- HWB
- hwb(84 84% 6%)
- OKLCH
- oklch(0.94 0.038 125.2)
- OKLab
- oklab(0.94 -0.022 0.031)
- CIE Lab
- lab(93.42 -7.28 11.79)
- LCH
- lch(93.42 13.85 121.7)
- CMYK
- cmyk(5% 0% 11% 6%)
浅色调 · 深色调 · 灰色调
浅色调
- E8F2D9
- EAF3DD
- EDF5E2
- EFF6E6
- F2F8EA
- F5F9EE
- F7FBF2
- FAFCF7
- FCFEFB
深色调
- C7D1B9
- AAB29E
- 8E9583
- 72786A
- 585D51
- 3F433A
- 282A24
- 121410
- 030302
灰色调
- DAE4CC
- D0D9C3
- C6CDBB
- BBC2B2
- B1B6AA
- A7ABA1
- 9DA099
- 939590
- 8A8B88
配色和谐
互补色 +180°
- E5F0D5
Spring Morn
- F1E5FF
≈ Minute Mauve
类似色 -30° +30°
- E5F0D5
Spring Morn
- F3EBCF
≈ Crisp Candlelight
- D8F3E0
≈ Delicate Sapling
三角配色 +120° +240°
- E5F0D5
Spring Morn
- DBEEFF
≈ Calcareous Sinter
- FFE3E8
≈ Hepatica
分裂互补色 +150° +210°
- E5F0D5
Spring Morn
- E5EAFF
≈ Glitter
- FCE2F5
≈ Bunny Tail
四角配色 +90° +180° +270°
- E5F0D5
Spring Morn
- D0F2FB
≈ Water
- F1E5FF
≈ Minute Mauve
- FFE4DD
≈ Misty Rose
对比度与无障碍
Ag
Fail白底
WCAG 1.18:1 · APCA Lc 9
Ag
AAA黑底
WCAG 17.75:1 · APCA Lc 95
最佳文字颜色: #000000
WCAG 17.75:1 (AAA) · APCA Lc 95
Contrast pairs
代码片段
CSS
:root {
--spring-morn: #e5f0d5;
--spring-morn-rgb: 229 240 213;
--spring-morn-oklch: oklch(0.94 0.038 125.2);
}
.element {
color: var(--spring-morn);
background-color: hsl(84 47% 89%);
border-color: oklch(0.94 0.038 125.2);
}Tailwind CSS v4
@theme {
--color-spring-morn: #e5f0d5;
--color-spring-morn-50: #f2f7ec;
--color-spring-morn-100: #e4eadd;
--color-spring-morn-200: #d0d7c7;
--color-spring-morn-300: #b2bba7;
--color-spring-morn-400: #99a38b;
--color-spring-morn-500: #808b70;
--color-spring-morn-600: #6d765f;
--color-spring-morn-700: #575e4c;
--color-spring-morn-800: #404536;
--color-spring-morn-900: #2c2f25;
--color-spring-morn-950: #191c14;
}SCSS
$spring-morn: #e5f0d5;
$spring-morn-rgb: 229, 240, 213;
$spring-morn-light: mix(#fff, $spring-morn, 20%);
$spring-morn-dark: mix(#000, $spring-morn, 20%);
.element {
color: $spring-morn;
box-shadow: 0 0 0 2px rgba($spring-morn, 0.35);
}