Cor nomeada · #E2F4E4
Aquarelle Green
Aquarelle Green é #E2F4E4: rgb(226 244 228), hsl(127 45% 92%), oklch(0.949 0.028 148.6). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Aquarelle Green color name →
#E2F4E4
oklch(0.949 0.028 148.6)
Conversões de cor
- HEX
- #e2f4e4
- RGB
- rgb(226 244 228)
- HSL
- hsl(127 45% 92%)
- HWB
- hwb(127 89% 4%)
- OKLCH
- oklch(0.949 0.028 148.6)
- OKLab
- oklab(0.949 -0.024 0.015)
- CIE Lab
- lab(94.52 -8.3 5.6)
- LCH
- lch(94.52 10.01 146)
- CMYK
- cmyk(7% 0% 7% 4%)
Tons claros · Sombras · Tons
Tons claros
- E5F5E7
- E8F6E9
- EBF7EC
- EEF8EF
- F1FAF1
- F3FBF4
- F6FCF7
- F9FDFA
- FCFEFC
Sombras
- C4D4C6
- A8B5A9
- 8C978D
- 717A72
- 575E58
- 3E443F
- 272B28
- 121412
- 030303
Tons
- D8E8DA
- CEDCCF
- C4D0C5
- BAC4BB
- B0B8B1
- A6ADA7
- 9CA19D
- 939693
- 898B8A
Harmonias de cor
Complementar +180°
- E2F4E4
Aquarelle Green
- FAE8F8
≈ Cherry Pearl
Análoga -30° +30°
- E2F4E4
Aquarelle Green
- ECF1DC
≈ Moth’s Wing
- DBF5EE
≈ Diluted Mint
Tríade +120° +240°
- E2F4E4
Aquarelle Green
- E7EEFF
≈ Brilliant White
- FFE8E5
≈ Sheer Rosebud
Complementar dividida +150° +210°
- E2F4E4
Aquarelle Green
- F0EBFF
≈ Placebo Purple
- FFE7EE
≈ Nosegay
Tétrade +90° +180° +270°
- E2F4E4
Aquarelle Green
- DEF1FF
≈ Wizard White
- FAE8F8
≈ Cherry Pearl
- FEEADC
≈ Guiding Star
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.14:1 · APCA Lc 0
Ag
AAASobre preto
WCAG 18.29:1 · APCA Lc 98
Melhor cor de texto: #000000
WCAG 18.29:1 (AAA) · APCA Lc 98
Contrast pairs
Trechos de código
CSS
:root {
--aquarelle-green: #e2f4e4;
--aquarelle-green-rgb: 226 244 228;
--aquarelle-green-oklch: oklch(0.949 0.028 148.6);
}
.element {
color: var(--aquarelle-green);
background-color: hsl(127 45% 92%);
border-color: oklch(0.949 0.028 148.6);
}Tailwind CSS v4
@theme {
--color-aquarelle-green: #e2f4e4;
--color-aquarelle-green-50: #f0f8f1;
--color-aquarelle-green-100: #e1ebe3;
--color-aquarelle-green-200: #ccd8ce;
--color-aquarelle-green-300: #aebcb0;
--color-aquarelle-green-400: #93a395;
--color-aquarelle-green-500: #7a8c7c;
--color-aquarelle-green-600: #677669;
--color-aquarelle-green-700: #525f54;
--color-aquarelle-green-800: #3c453d;
--color-aquarelle-green-900: #29302a;
--color-aquarelle-green-950: #171c17;
}SCSS
$aquarelle-green: #e2f4e4;
$aquarelle-green-rgb: 226, 244, 228;
$aquarelle-green-light: mix(#fff, $aquarelle-green, 20%);
$aquarelle-green-dark: mix(#000, $aquarelle-green, 20%);
.element {
color: $aquarelle-green;
box-shadow: 0 0 0 2px rgba($aquarelle-green, 0.35);
}