Color con nombre · #EEC0D2
Guava Glow
Guava Glow es #EEC0D2: rgb(238 192 210), hsl(337 58% 84%), oklch(0.853 0.057 353). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Pink mean? → · Guava Glow color name →
#EEC0D2
oklch(0.853 0.057 353)
Conversiones de color
- HEX
- #eec0d2
- RGB
- rgb(238 192 210)
- HSL
- hsl(337 58% 84%)
- HWB
- hwb(337 75% 7%)
- OKLCH
- oklch(0.853 0.057 353)
- OKLab
- oklab(0.853 0.057 -0.007)
- CIE Lab
- lab(82.23 19.03 -2.48)
- LCH
- lch(82.23 19.19 352.6)
- CMYK
- cmyk(0% 19% 12% 7%)
Tintes · Sombras · Tonos
Tintes
- F0C6D6
- F2CDDB
- F4D3DF
- F6D9E4
- F7DFE8
- F9E6ED
- FBECF1
- FCF2F6
- FEF9FA
Sombras
- CFA7B6
- B18E9B
- 937681
- 775F68
- 5C4950
- 423439
- 2A2024
- 140E10
- 030202
Tonos
- E3B9C9
- D7B3C1
- CCACB9
- C1A6B0
- B6A0A8
- AB99A0
- A09398
- 958D90
- 8B8688
Armonías de color
Complementario +180°
- EEC0D2
Guava Glow
- A9DCCB
≈ Prism
Análogo -30° +30°
- EEC0D2
Guava Glow
- E2C3E5
≈ Prom Corsage
- F2C1BD
≈ Silver Strawberry
Triádico +120° +240°
- EEC0D2
Guava Glow
- CED3A9
≈ Olive Martini
- AAD6EF
≈ Blue Bubble
Complementario dividido +150° +210°
- EEC0D2
Guava Glow
- BAD9B7
≈ Grasshopper Pie
- A3DADF
≈ Crystal
Tetrádico +90° +180° +270°
- EEC0D2
Guava Glow
- E1CCA5
≈ Hearth
- A9DCCB
≈ Prism
- BBCFF5
≈ Frost Fairy
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.60:1 · APCA Lc 27
Ag
AAASobre negro
WCAG 13.10:1 · APCA Lc 76
Mejor color de texto: #000000
WCAG 13.10:1 (AAA) · APCA Lc 76
Contrast pairs
Fragmentos de código
CSS
:root {
--guava-glow: #eec0d2;
--guava-glow-rgb: 238 192 210;
--guava-glow-oklch: oklch(0.853 0.057 353);
}
.element {
color: var(--guava-glow);
background-color: hsl(337 58% 84%);
border-color: oklch(0.853 0.057 353);
}Tailwind CSS v4
@theme {
--color-guava-glow: #eec0d2;
--color-guava-glow-50: #ffeff6;
--color-guava-glow-100: #f9e0e9;
--color-guava-glow-200: #e9cbd5;
--color-guava-glow-300: #d0acb9;
--color-guava-glow-400: #ba91a1;
--color-guava-glow-500: #a57789;
--color-guava-glow-600: #8b6574;
--color-guava-glow-700: #70505d;
--color-guava-glow-800: #523a45;
--color-guava-glow-900: #392830;
--color-guava-glow-950: #23161c;
}SCSS
$guava-glow: #eec0d2;
$guava-glow-rgb: 238, 192, 210;
$guava-glow-light: mix(#fff, $guava-glow, 20%);
$guava-glow-dark: mix(#000, $guava-glow, 20%);
.element {
color: $guava-glow;
box-shadow: 0 0 0 2px rgba($guava-glow, 0.35);
}