Nazwany kolor · #CC88FF
Crash Pink
Crash Pink to #CC88FF: rgb(204 136 255), hsl(274 100% 77%), oklch(0.742 0.178 309.1). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Crash Pink color name →
#CC88FF
oklch(0.742 0.178 309.1)
Konwersje koloru
- HEX
- #cc88ff
- RGB
- rgb(204 136 255)
- HSL
- hsl(274 100% 77%)
- HWB
- hwb(274 53% 0%)
- OKLCH
- oklch(0.742 0.178 309.1)
- OKLab
- oklab(0.742 0.112 -0.138)
- CIE Lab
- lab(67.39 42.59 -49.66)
- LCH
- lch(67.39 65.42 310.6)
- CMYK
- cmyk(20% 47% 0% 0%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D195FF
- D6A1FF
- DBADFF
- E1B9FF
- E6C5FF
- EBD1FF
- F0DCFF
- F5E8FF
- FAF3FF
Odcienie ciemniejsze
- B175DE
- 9763BE
- 7E529E
- 654180
- 4E3163
- 372248
- 22132E
- 0F0616
- 020103
Tony
- C488F2
- BC88E5
- B588D9
- AD87CC
- A586BF
- 9E86B3
- 9684A6
- 8F8399
- 87828D
Harmonie kolorów
Komplementarna +180°
- CC88FF
Crash Pink
- 88C031
≈ Dark Lemon Lime
Analogowa -30° +30°
- CC88FF
Crash Pink
- 9AA1FF
≈ Cobalite
- F17AD0
≈ Nervous Neon Pink
Triada +120° +240°
- CC88FF
Crash Pink
- EC9500
≈ Gold Fusion
- 00C5BC
≈ Swimmers Pool
Komplementarna rozszczepiona +150° +210°
- CC88FF
Crash Pink
- C4AC00
≈ Muddy Yellow
- 00CB83
≈ Retro Lime
Tetrada +90° +180° +270°
- CC88FF
Crash Pink
- FF8359
≈ Pink Fire
- 88C031
≈ Dark Lemon Lime
- 00BEE4
≈ Blue Raspberry
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.46:1 · APCA Lc 48
Ag
AAANa czerni
WCAG 8.53:1 · APCA Lc 54
Najlepszy kolor tekstu: #000000
WCAG 8.53:1 (AAA) · APCA Lc 54
Contrast pairs
Fragmenty kodu
CSS
:root {
--crash-pink: #cc88ff;
--crash-pink-rgb: 204 136 255;
--crash-pink-oklch: oklch(0.742 0.178 309.1);
}
.element {
color: var(--crash-pink);
background-color: hsl(274 100% 77%);
border-color: oklch(0.742 0.178 309.1);
}Tailwind CSS v4
@theme {
--color-crash-pink: #cc88ff;
--color-crash-pink-50: #ffe7ff;
--color-crash-pink-100: #fbd8ff;
--color-crash-pink-200: #edbfff;
--color-crash-pink-300: #d59cfa;
--color-crash-pink-400: #bd7ded;
--color-crash-pink-500: #a85cdd;
--color-crash-pink-600: #8e4fbb;
--color-crash-pink-700: #723f96;
--color-crash-pink-800: #532e71;
--color-crash-pink-900: #3a1f50;
--color-crash-pink-950: #240e35;
}SCSS
$crash-pink: #cc88ff;
$crash-pink-rgb: 204, 136, 255;
$crash-pink-light: mix(#fff, $crash-pink, 20%);
$crash-pink-dark: mix(#000, $crash-pink, 20%);
.element {
color: $crash-pink;
box-shadow: 0 0 0 2px rgba($crash-pink, 0.35);
}