命名颜色 · #87FF2A
Spring Frost
Spring Frost 即 #87FF2A：rgb(135 255 42)、hsl(94 100% 58%)、oklch(0.894 0.253 135.8)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Green mean? → · Spring Frost color name →
#87FF2A
oklch(0.894 0.253 135.8)
颜色转换
- HEX
- #87ff2a
- RGB
- rgb(135 255 42)
- HSL
- hsl(94 100% 58%)
- HWB
- hwb(94 16% 0%)
- OKLCH
- oklch(0.894 0.253 135.8)
- OKLab
- oklab(0.894 -0.182 0.177)
- CIE Lab
- lab(90.42 -58.61 79.2)
- LCH
- lch(90.42 98.53 126.5)
- CMYK
- cmyk(47% 0% 84% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- 95FF52
- A3FF6E
- AFFF84
- BCFF98
- C7FFAB
- D3FFBD
- DEFFCE
- E9FFDF
- F4FFEF
深色调
- 75DE23
- 63BE1C
- 519E16
- 418010
- 31630A
- 214805
- 132E02
- 061601
- 010300
灰色调
- 88F242
- 89E551
- 89D95C
- 89CC65
- 88BF6C
- 87B372
- 86A677
- 84997A
- 828D7E
配色和谐
互补色 +180°
- 87FF2A
Spring Frost
- F0CDFF
≈ Sparkling Lavender
类似色 -30° +30°
- 87FF2A
Spring Frost
- EEE200
≈ Birdie
- 46FFC2
≈ Move Mint
三角配色 +120° +240°
- 87FF2A
Spring Frost
- C6DEFF
≈ Arc Light
- FFCED0
≈ Lusty-Gallant
分裂互补色 +150° +210°
- 87FF2A
Spring Frost
- D8D8FF
≈ Icy Plains
- FFCBE6
≈ Classic Rose
四角配色 +90° +180° +270°
- 87FF2A
Spring Frost
- ACE6FF
≈ Frozen Landscape
- F0CDFF
≈ Sparkling Lavender
- FFD1BC
≈ Vienna Sausage
对比度与无障碍
Ag
Fail白底
WCAG 1.28:1 · APCA Lc 14
Ag
AAA黑底
WCAG 16.36:1 · APCA Lc 90
最佳文字颜色: #000000
WCAG 16.36:1 (AAA) · APCA Lc 90
Contrast pairs
代码片段
CSS
:root {
--spring-frost: #87ff2a;
--spring-frost-rgb: 135 255 42;
--spring-frost-oklch: oklch(0.894 0.253 135.8);
}
.element {
color: var(--spring-frost);
background-color: hsl(94 100% 58%);
border-color: oklch(0.894 0.253 135.8);
}Tailwind CSS v4
@theme {
--color-spring-frost: #87ff2a;
--color-spring-frost-50: #d2ffc0;
--color-spring-frost-100: #befca8;
--color-spring-frost-200: #9ded7f;
--color-spring-frost-300: #70d444;
--color-spring-frost-400: #4cbc00;
--color-spring-frost-500: #00a500;
--color-spring-frost-600: #0a8c00;
--color-spring-frost-700: #0b7000;
--color-spring-frost-800: #125200;
--color-spring-frost-900: #0c3900;
--color-spring-frost-950: #002300;
}SCSS
$spring-frost: #87ff2a;
$spring-frost-rgb: 135, 255, 42;
$spring-frost-light: mix(#fff, $spring-frost, 20%);
$spring-frost-dark: mix(#000, $spring-frost, 20%);
.element {
color: $spring-frost;
box-shadow: 0 0 0 2px rgba($spring-frost, 0.35);
}