Nazwany kolor · #FF8D86
Prime Pink
Prime Pink to #FF8D86: rgb(255 141 134), hsl(3 100% 76%), oklch(0.765 0.139 24.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Prime Pink color name →
#FF8D86
oklch(0.765 0.139 24.5)
Konwersje koloru
- HEX
- #ff8d86
- RGB
- rgb(255 141 134)
- HSL
- hsl(3 100% 76%)
- HWB
- hwb(3 53% 0%)
- OKLCH
- oklch(0.765 0.139 24.5)
- OKLab
- oklab(0.765 0.127 0.058)
- CIE Lab
- lab(71.41 43.52 23.96)
- LCH
- lch(71.41 49.68 28.8)
- CMYK
- cmyk(0% 45% 47% 0%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- FF9992
- FFA59E
- FFB0AA
- FFBCB6
- FFC7C2
- FFD2CE
- FFDEDA
- FFE9E6
- FFF4F3
Odcienie ciemniejsze
- DE7A74
- BE6762
- 9E5551
- 804440
- 633330
- 482321
- 2E1413
- 160706
- 030101
Tony
- F38C86
- E68C85
- DA8B85
- CD8A84
- C18984
- B48783
- A78682
- 9A8482
- 8D8281
Harmonie kolorów
Komplementarna +180°
- FF8D86
Prime Pink
- 00CAD9
≈ Jade Glass
Analogowa -30° +30°
- FF8D86
Prime Pink
- F78BB8
≈ Cochonnet
- F69956
≈ Fading Torch
Triada +120° +240°
- FF8D86
Prime Pink
- 77CA79
≈ Snow Pea
- 8DB1FF
≈ Kitten’s Eye
Komplementarna rozszczepiona +150° +210°
- FF8D86
Prime Pink
- 23CFAD
≈ Mint Leaf
- 42C0FE
≈ Megaman
Tetrada +90° +180° +270°
- FF8D86
Prime Pink
- B1BC49
≈ Hopscotch
- 00CAD9
≈ Jade Glass
- B8A1FF
≈ Diva
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.23:1 · APCA Lc 44
Ag
AAANa czerni
WCAG 9.40:1 · APCA Lc 59
Najlepszy kolor tekstu: #000000
WCAG 9.40:1 (AAA) · APCA Lc 59
Contrast pairs
Fragmenty kodu
CSS
:root {
--prime-pink: #ff8d86;
--prime-pink-rgb: 255 141 134;
--prime-pink-oklch: oklch(0.765 0.139 24.5);
}
.element {
color: var(--prime-pink);
background-color: hsl(3 100% 76%);
border-color: oklch(0.765 0.139 24.5);
}Tailwind CSS v4
@theme {
--color-prime-pink: #ff8d86;
--color-prime-pink-50: #ffe7e0;
--color-prime-pink-100: #ffd7cf;
--color-prime-pink-200: #ffbeb5;
--color-prime-pink-300: #f69b91;
--color-prime-pink-400: #e57b75;
--color-prime-pink-500: #d25a56;
--color-prime-pink-600: #b24d4a;
--color-prime-pink-700: #8f3e3a;
--color-prime-pink-800: #6a2c2b;
--color-prime-pink-900: #4b1d1d;
--color-prime-pink-950: #310d0d;
}SCSS
$prime-pink: #ff8d86;
$prime-pink-rgb: 255, 141, 134;
$prime-pink-light: mix(#fff, $prime-pink, 20%);
$prime-pink-dark: mix(#000, $prime-pink, 20%);
.element {
color: $prime-pink;
box-shadow: 0 0 0 2px rgba($prime-pink, 0.35);
}