Cor nomeada · #F18870
Juicy Passionfruit
Juicy Passionfruit é #F18870: rgb(241 136 112), hsl(11 82% 69%), oklch(0.735 0.134 33.9). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Red mean? → · Juicy Passionfruit color name →
#F18870
oklch(0.735 0.134 33.9)
Conversões de cor
- HEX
- #f18870
- RGB
- rgb(241 136 112)
- HSL
- hsl(11 82% 69%)
- HWB
- hwb(11 44% 5%)
- OKLCH
- oklch(0.735 0.134 33.9)
- OKLab
- oklab(0.735 0.111 0.074)
- CIE Lab
- lab(68.17 39.31 31.36)
- LCH
- lch(68.17 50.28 38.6)
- CMYK
- cmyk(0% 44% 54% 5%)
Tons claros · Sombras · Tons
Tons claros
- F4947E
- F6A18C
- F9AD9B
- FAB9A9
- FCC4B7
- FDD0C5
- FEDCD4
- FFE8E2
- FFF3F0
Sombras
- D27560
- B36351
- 955243
- 794135
- 5D3127
- 43221A
- 2B130E
- 140604
- 030101
Tons
- E68872
- DB8874
- D08776
- C58778
- BA867A
- AE857B
- A3847C
- 98837E
- 8C817F
Harmonias de cor
Complementar +180°
- F18870
Juicy Passionfruit
- 00BDDB
≈ Maldives
Análoga -30° +30°
- F18870
Juicy Passionfruit
- EE83A0
≈ Iced Berry
- E39545
≈ Yellow Sumac
Tríade +120° +240°
- F18870
Juicy Passionfruit
- 5CC282
≈ Enamelled Dragon
- 8FA2FD
≈ Periwinkle Blue
Complementar dividida +150° +210°
- F18870
Juicy Passionfruit
- 00C3B2
≈ Amazonite
- 55B2F7
≈ Tiān Lán Sky
Tétrade +90° +180° +270°
- F18870
Juicy Passionfruit
- 98B752
≈ Clematis Green
- 00BDDB
≈ Maldives
- BC93EE
≈ Luminous Lavender
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 2.47:1 · APCA Lc 48
Ag
AAASobre preto
WCAG 8.49:1 · APCA Lc 54
Melhor cor de texto: #000000
WCAG 8.49:1 (AAA) · APCA Lc 54
Contrast pairs
Trechos de código
CSS
:root {
--juicy-passionfruit: #f18870;
--juicy-passionfruit-rgb: 241 136 112;
--juicy-passionfruit-oklch: oklch(0.735 0.134 33.9);
}
.element {
color: var(--juicy-passionfruit);
background-color: hsl(11 82% 69%);
border-color: oklch(0.735 0.134 33.9);
}Tailwind CSS v4
@theme {
--color-juicy-passionfruit: #f18870;
--color-juicy-passionfruit-50: #ffe9db;
--color-juicy-passionfruit-100: #ffd9ca;
--color-juicy-passionfruit-200: #ffc1ad;
--color-juicy-passionfruit-300: #f39f88;
--color-juicy-passionfruit-400: #e27f69;
--color-juicy-passionfruit-500: #cf6047;
--color-juicy-passionfruit-600: #af523d;
--color-juicy-passionfruit-700: #8d4130;
--color-juicy-passionfruit-800: #692e24;
--color-juicy-passionfruit-900: #4a1f18;
--color-juicy-passionfruit-950: #300e09;
}SCSS
$juicy-passionfruit: #f18870;
$juicy-passionfruit-rgb: 241, 136, 112;
$juicy-passionfruit-light: mix(#fff, $juicy-passionfruit, 20%);
$juicy-passionfruit-dark: mix(#000, $juicy-passionfruit, 20%);
.element {
color: $juicy-passionfruit;
box-shadow: 0 0 0 2px rgba($juicy-passionfruit, 0.35);
}