Cor nomeada · #B54D7F
Exuberant Pink
Exuberant Pink é #B54D7F: rgb(181 77 127), hsl(331 41% 51%), oklch(0.569 0.145 352.7). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Red mean? → · Exuberant Pink color name →
#B54D7F
oklch(0.569 0.145 352.7)
Conversões de cor
- HEX
- #b54d7f
- RGB
- rgb(181 77 127)
- HSL
- hsl(331 41% 51%)
- HWB
- hwb(331 30% 29%)
- OKLCH
- oklch(0.569 0.145 352.7)
- OKLab
- oklab(0.569 0.144 -0.018)
- CIE Lab
- lab(48.12 46.83 -6.45)
- LCH
- lch(48.12 47.27 352.2)
- CMYK
- cmyk(0% 57% 30% 29%)
Tons claros · Sombras · Tons
Tons claros
- BE608B
- C77197
- CF83A4
- D795B0
- DFA6BD
- E6B8CA
- EDC9D7
- F3DBE4
- F9EDF2
Sombras
- 9D426E
- 86375D
- 6F2C4C
- 59223C
- 44182D
- 300F1F
- 1D0711
- 0C0206
- 020001
Tons
- B1547F
- AC5A7F
- A85F7F
- A3657F
- 9E6A80
- 986E80
- 937380
- 8D7880
- 877C80
Harmonias de cor
Complementar +180°
- B54D7F
Exuberant Pink
- 008C71
≈ Carolina Green
Análoga -30° +30°
- B54D7F
Exuberant Pink
- 9F56A8
≈ Orchid Dottyback
- BE4D4E
≈ Bittersweet Shimmer
Tríade +120° +240°
- B54D7F
Exuberant Pink
- 797E00
≈ Verde Tropa
- 0082B0
≈ Tusche Blue
Complementar dividida +150° +210°
- B54D7F
Exuberant Pink
- 3A8C37
≈ Resplendent Growth
- 008890
≈ Ocean Soul
Tétrade +90° +180° +270°
- B54D7F
Exuberant Pink
- 996F00
≈ Sandy Taupe
- 008C71
≈ Carolina Green
- 4773CC
≈ Fading Night
Contraste e acessibilidade
Ag
AASobre branco
WCAG 4.84:1 · APCA Lc 73
Ag
FailSobre preto
WCAG 4.33:1 · APCA Lc 29
Melhor cor de texto: #FFFFFF
WCAG 4.84:1 (AA) · APCA Lc 73
Contrast pairs
Trechos de código
CSS
:root {
--exuberant-pink: #b54d7f;
--exuberant-pink-rgb: 181 77 127;
--exuberant-pink-oklch: oklch(0.569 0.145 352.7);
}
.element {
color: var(--exuberant-pink);
background-color: hsl(331 41% 51%);
border-color: oklch(0.569 0.145 352.7);
}Tailwind CSS v4
@theme {
--color-exuberant-pink: #b54d7f;
--color-exuberant-pink-50: #ffe5f7;
--color-exuberant-pink-100: #ffd4eb;
--color-exuberant-pink-200: #ffbbd8;
--color-exuberant-pink-300: #f297bb;
--color-exuberant-pink-400: #df78a6;
--color-exuberant-pink-500: #cc578f;
--color-exuberant-pink-600: #ac4a79;
--color-exuberant-pink-700: #8a3b61;
--color-exuberant-pink-800: #662a49;
--color-exuberant-pink-900: #481c32;
--color-exuberant-pink-950: #2f0c1e;
}SCSS
$exuberant-pink: #b54d7f;
$exuberant-pink-rgb: 181, 77, 127;
$exuberant-pink-light: mix(#fff, $exuberant-pink, 20%);
$exuberant-pink-dark: mix(#000, $exuberant-pink, 20%);
.element {
color: $exuberant-pink;
box-shadow: 0 0 0 2px rgba($exuberant-pink, 0.35);
}