Cor nomeada · #EDAAAC
Hibiscus Petal
Hibiscus Petal é #EDAAAC: rgb(237 170 172), hsl(358 65% 80%), oklch(0.802 0.079 17). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Pink mean? → · Hibiscus Petal color name →
#EDAAAC
oklch(0.802 0.079 17)
Conversões de cor
- HEX
- #edaaac
- RGB
- rgb(237 170 172)
- HSL
- hsl(358 65% 80%)
- HWB
- hwb(358 67% 7%)
- OKLCH
- oklch(0.802 0.079 17)
- OKLab
- oklab(0.802 0.076 0.023)
- CIE Lab
- lab(76.17 25.55 9.3)
- LCH
- lch(76.17 27.19 20)
- CMYK
- cmyk(0% 28% 27% 7%)
Tons claros · Sombras · Tons
Tons claros
- EFB2B4
- F2BBBC
- F4C3C4
- F6CCCD
- F8D4D5
- F9DDDD
- FBE5E6
- FDEEEE
- FEF6F6
Sombras
- CE9395
- B07D7F
- 936869
- 775354
- 5C3F40
- 422D2D
- 2A1B1B
- 140B0B
- 030101
Tons
- E2A6A8
- D7A2A3
- CC9E9F
- C1999A
- B69596
- AB9191
- A08D8D
- 968989
- 8B8484
Harmonias de cor
Complementar +180°
- EDAAAC
Hibiscus Petal
- 7ECED0
≈ Aqua Splash
Análoga -30° +30°
- EDAAAC
Hibiscus Petal
- E5AAC8
≈ Party Time
- EAAF93
≈ Sweet Marmalade
Tríade +120° +240°
- EDAAAC
Hibiscus Petal
- A7CB98
≈ Oh Pistachio
- 9EC1F1
≈ Sail to the Sea
Complementar dividida +150° +210°
- EDAAAC
Hibiscus Petal
- 8BCFB4
≈ Tropical Trail
- 86C9E6
≈ Gossamer Threads
Tétrade +90° +180° +270°
- EDAAAC
Hibiscus Petal
- C4C286
≈ Fiddlehead Fern
- 7ECED0
≈ Aqua Splash
- BAB7EF
≈ Purple Illusion
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.91:1 · APCA Lc 37
Ag
AAASobre preto
WCAG 10.94:1 · APCA Lc 66
Melhor cor de texto: #000000
WCAG 10.94:1 (AAA) · APCA Lc 66
Contrast pairs
Trechos de código
CSS
:root {
--hibiscus-petal: #edaaac;
--hibiscus-petal-rgb: 237 170 172;
--hibiscus-petal-oklch: oklch(0.802 0.079 17);
}
.element {
color: var(--hibiscus-petal);
background-color: hsl(358 65% 80%);
border-color: oklch(0.802 0.079 17);
}Tailwind CSS v4
@theme {
--color-hibiscus-petal: #edaaac;
--color-hibiscus-petal-50: #ffedec;
--color-hibiscus-petal-100: #ffdedd;
--color-hibiscus-petal-200: #f5c7c7;
--color-hibiscus-petal-300: #dda8a7;
--color-hibiscus-petal-400: #c98c8e;
--color-hibiscus-petal-500: #b57073;
--color-hibiscus-petal-600: #995f62;
--color-hibiscus-petal-700: #7a4c4e;
--color-hibiscus-petal-800: #5b3739;
--color-hibiscus-petal-900: #3f2527;
--color-hibiscus-petal-950: #281415;
}SCSS
$hibiscus-petal: #edaaac;
$hibiscus-petal-rgb: 237, 170, 172;
$hibiscus-petal-light: mix(#fff, $hibiscus-petal, 20%);
$hibiscus-petal-dark: mix(#000, $hibiscus-petal, 20%);
.element {
color: $hibiscus-petal;
box-shadow: 0 0 0 2px rgba($hibiscus-petal, 0.35);
}