Cor nomeada · #FF5C8D
Stellar Strawberry
Stellar Strawberry é #FF5C8D: rgb(255 92 141), hsl(342 100% 68%), oklch(0.702 0.201 5.5). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Red mean? → · Stellar Strawberry color name →
#FF5C8D
oklch(0.702 0.201 5.5)
Conversões de cor
- HEX
- #ff5c8d
- RGB
- rgb(255 92 141)
- HSL
- hsl(342 100% 68%)
- HWB
- hwb(342 36% 0%)
- OKLCH
- oklch(0.702 0.201 5.5)
- OKLab
- oklab(0.702 0.2 0.019)
- CIE Lab
- lab(62.96 65.43 8.49)
- LCH
- lch(62.96 65.98 7.4)
- CMYK
- cmyk(0% 64% 45% 0%)
Tons claros · Sombras · Tons
Tons claros
- FF7098
- FF81A3
- FF92AE
- FFA3B9
- FFB3C5
- FFC2D0
- FFD2DC
- FFE1E7
- FFF0F3
Sombras
- DE4F7A
- BE4267
- 9E3655
- 802A44
- 631F33
- 481423
- 2E0A14
- 160307
- 030001
Tons
- F3638C
- E7688A
- DB6D89
- CF7188
- C37587
- B67885
- AA7A84
- 9C7D83
- 8E7E81
Harmonias de cor
Complementar +180°
- FF5C8D
Stellar Strawberry
- 00B7A9
≈ Verditer
Análoga -30° +30°
- FF5C8D
Stellar Strawberry
- E765CE
≈ Death of a Star
- FF6841
≈ Halloween
Tríade +120° +240°
- FF5C8D
Stellar Strawberry
- 85B100
≈ Brilliant Green
- 25A6FF
≈ Xed
Complementar dividida +150° +210°
- FF5C8D
Stellar Strawberry
- 00BD6E
≈ Welsh Onion
- 00B1CF
≈ Aquarius
Tétrade +90° +180° +270°
- FF5C8D
Stellar Strawberry
- BB9D00
≈ Perennial
- 00B7A9
≈ Verditer
- 8494FF
≈ Periwinkle Blue
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 2.92:1 · APCA Lc 55
Ag
AAASobre preto
WCAG 7.16:1 · APCA Lc 47
Melhor cor de texto: #000000
WCAG 7.16:1 (AAA) · APCA Lc 47
Contrast pairs
Trechos de código
CSS
:root {
--stellar-strawberry: #ff5c8d;
--stellar-strawberry-rgb: 255 92 141;
--stellar-strawberry-oklch: oklch(0.702 0.201 5.5);
}
.element {
color: var(--stellar-strawberry);
background-color: hsl(342 100% 68%);
border-color: oklch(0.702 0.201 5.5);
}Tailwind CSS v4
@theme {
--color-stellar-strawberry: #ff5c8d;
--color-stellar-strawberry-50: #ffdeeb;
--color-stellar-strawberry-100: #ffccdc;
--color-stellar-strawberry-200: #ffafc5;
--color-stellar-strawberry-300: #ff87a5;
--color-stellar-strawberry-400: #fa618d;
--color-stellar-strawberry-500: #e93073;
--color-stellar-strawberry-600: #c52c62;
--color-stellar-strawberry-700: #9e234e;
--color-stellar-strawberry-800: #76173b;
--color-stellar-strawberry-900: #531028;
--color-stellar-strawberry-950: #370116;
}SCSS
$stellar-strawberry: #ff5c8d;
$stellar-strawberry-rgb: 255, 92, 141;
$stellar-strawberry-light: mix(#fff, $stellar-strawberry, 20%);
$stellar-strawberry-dark: mix(#000, $stellar-strawberry, 20%);
.element {
color: $stellar-strawberry;
box-shadow: 0 0 0 2px rgba($stellar-strawberry, 0.35);
}