Cor nomeada mais próxima · #FF33C3
#FF33C3
Cor nomeada mais próxima: Pink Glamour
#FF33C3 (rgb(255 51 195), hsl(318 100% 60%), oklch(0.686 0.266 343.4)) é mais próxima da cor nomeada Pink Glamour. Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
#FF33C3
oklch(0.686 0.266 343.4)
Conversões de cor
- HEX
- #ff33c3
- RGB
- rgb(255 51 195)
- HSL
- hsl(318 100% 60%)
- HWB
- hwb(318 20% 0%)
- OKLCH
- oklch(0.686 0.266 343.4)
- OKLab
- oklab(0.686 0.255 -0.076)
- CIE Lab
- lab(59.83 81.93 -27.27)
- LCH
- lch(59.83 86.35 341.6)
- CMYK
- cmyk(0% 80% 24% 0%)
Tons claros · Sombras · Tons
Tons claros
- FF53C9
- FF6CCF
- FF81D6
- FF95DC
- FFA8E2
- FFBAE8
- FFCBEE
- FFDDF3
- FFEEF9
Sombras
- DE2BA9
- BE2390
- 9E1C78
- 801460
- 630D4A
- 480734
- 2E0320
- 16010E
- 030002
Tons
- F344BC
- E851B6
- DC5BAF
- D063A8
- C46AA2
- B76F9B
- AA7594
- 9D798E
- 8F7D87
Harmonias de cor
Complementar +180°
- FF33C3
Pink Glamour
- 00B680
≈ April Fool’s Red
Análoga -30° +30°
- FF33C3
Pink Glamour
- CD5FFF
≈ After-Party Pink
- FF5374
≈ Fiery Rose
Tríade +120° +240°
- FF33C3
Pink Glamour
- AB9D00
≈ Nuclear Fallout
- 00AAD4
≈ Battery Charged Blue
Complementar dividida +150° +210°
- FF33C3
Pink Glamour
- 65B200
≈ Kermit Green
- 00B0AF
≈ Laguna Green
Tétrade +90° +180° +270°
- FF33C3
Pink Glamour
- CF8A00
≈ Lobster Butter Sauce
- 00B680
≈ April Fool’s Red
- 439CFF
≈ Sky Dancer
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 3.22:1 · APCA Lc 58
Ag
AASobre preto
WCAG 6.51:1 · APCA Lc 44
Melhor cor de texto: #000000
WCAG 6.51:1 (AA) · APCA Lc 44
Contrast pairs
Trechos de código
CSS
:root {
--pink-glamour: #ff33c3;
--pink-glamour-rgb: 255 51 195;
--pink-glamour-oklch: oklch(0.686 0.266 343.4);
}
.element {
color: var(--pink-glamour);
background-color: hsl(318 100% 60%);
border-color: oklch(0.686 0.266 343.4);
}Tailwind CSS v4
@theme {
--color-pink-glamour: #ff33c3;
--color-pink-glamour-50: #ffd7ff;
--color-pink-glamour-100: #ffc3fc;
--color-pink-glamour-200: #ffa2ed;
--color-pink-glamour-300: #ff75d5;
--color-pink-glamour-400: #ff44c6;
--color-pink-glamour-500: #ee00b1;
--color-pink-glamour-600: #c90096;
--color-pink-glamour-700: #a20078;
--color-pink-glamour-800: #78005c;
--color-pink-glamour-900: #550040;
--color-pink-glamour-950: #380029;
}SCSS
$pink-glamour: #ff33c3;
$pink-glamour-rgb: 255, 51, 195;
$pink-glamour-light: mix(#fff, $pink-glamour, 20%);
$pink-glamour-dark: mix(#000, $pink-glamour, 20%);
.element {
color: $pink-glamour;
box-shadow: 0 0 0 2px rgba($pink-glamour, 0.35);
}