Cor nomeada · #8CFD7E
Easter Green
Easter Green é #8CFD7E: rgb(140 253 126), hsl(113 97% 74%), oklch(0.899 0.195 141.6). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Green mean? → · Easter Green color name →
#8CFD7E
oklch(0.899 0.195 141.6)
Conversões de cor
- HEX
- #8cfd7e
- RGB
- rgb(140 253 126)
- HSL
- hsl(113 97% 74%)
- HWB
- hwb(113 49% 1%)
- OKLCH
- oklch(0.899 0.195 141.6)
- OKLab
- oklab(0.899 -0.153 0.122)
- CIE Lab
- lab(90.56 -51.67 49.75)
- LCH
- lch(90.56 71.73 136.1)
- CMYK
- cmyk(45% 0% 50% 1%)
Tons claros · Sombras · Tons
Tons claros
- 9AFE8D
- A7FE9B
- B3FFA9
- BFFFB6
- CAFFC2
- D5FFCF
- E0FFDB
- EAFFE7
- F5FFF3
Sombras
- 79DC6D
- 67BC5C
- 559D4C
- 437F3C
- 33622D
- 23471F
- 142D11
- 071605
- 010301
Tons
- 8DF080
- 8DE382
- 8CD783
- 8CCA83
- 8BBE84
- 89B183
- 87A583
- 859982
- 838C81
Harmonias de cor
Complementar +180°
- 8CFD7E
Easter Green
- F8CCFF
≈ Sassy Pink
Análoga -30° +30°
- 8CFD7E
Easter Green
- E3E915
≈ Titanium Yellow
- 49FFD1
≈ Move Mint
Tríade +120° +240°
- 8CFD7E
Easter Green
- CCDFFF
≈ Arc Light
- FFD1CE
≈ Girlie
Complementar dividida +150° +210°
- 8CFD7E
Easter Green
- DDD8FF
≈ Transparent Blue
- FFCEE2
≈ Linnet Egg Red
Tétrade +90° +180° +270°
- 8CFD7E
Easter Green
- B6E6FF
≈ Frozen Landscape
- F8CCFF
≈ Sassy Pink
- FFD3BA
≈ Peachy Bon-Bon
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.27:1 · APCA Lc 13
Ag
AAASobre preto
WCAG 16.46:1 · APCA Lc 90
Melhor cor de texto: #000000
WCAG 16.46:1 (AAA) · APCA Lc 90
Contrast pairs
Trechos de código
CSS
:root {
--easter-green: #8cfd7e;
--easter-green-rgb: 140 253 126;
--easter-green-oklch: oklch(0.899 0.195 141.6);
}
.element {
color: var(--easter-green);
background-color: hsl(113 97% 74%);
border-color: oklch(0.899 0.195 141.6);
}Tailwind CSS v4
@theme {
--color-easter-green: #8cfd7e;
--color-easter-green-50: #d4ffd2;
--color-easter-green-100: #c1fabe;
--color-easter-green-200: #a0ea9e;
--color-easter-green-300: #75d173;
--color-easter-green-400: #4fba43;
--color-easter-green-500: #09a300;
--color-easter-green-600: #128a00;
--color-easter-green-700: #106f00;
--color-easter-green-800: #125100;
--color-easter-green-900: #0b3800;
--color-easter-green-950: #002300;
}SCSS
$easter-green: #8cfd7e;
$easter-green-rgb: 140, 253, 126;
$easter-green-light: mix(#fff, $easter-green, 20%);
$easter-green-dark: mix(#000, $easter-green, 20%);
.element {
color: $easter-green;
box-shadow: 0 0 0 2px rgba($easter-green, 0.35);
}