Nazwany kolor · #FA1A8E
Philippine Pink
Philippine Pink to #FA1A8E: rgb(250 26 142), hsl(329 96% 54%), oklch(0.646 0.254 357.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Philippine Pink color name →
#FA1A8E
oklch(0.646 0.254 357.8)
Konwersje koloru
- HEX
- #fa1a8e
- RGB
- rgb(250 26 142)
- HSL
- hsl(329 96% 54%)
- HWB
- hwb(329 10% 2%)
- OKLCH
- oklch(0.646 0.254 357.8)
- OKLab
- oklab(0.646 0.254 -0.01)
- CIE Lab
- lab(55.74 81.34 -2.55)
- LCH
- lch(55.74 81.38 358.2)
- CMYK
- cmyk(0% 90% 43% 2%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- FE4599
- FF61A4
- FF78AF
- FF8DBA
- FFA1C5
- FFB5D0
- FFC8DC
- FFDAE7
- FFEDF3
Odcienie ciemniejsze
- D9157B
- BA1068
- 9B0C56
- 7D0744
- 610434
- 460224
- 2D0115
- 150007
- 030001
Tony
- EF358D
- E5458B
- D9518A
- CE5B88
- C36487
- B76B86
- AA7184
- 9D7783
- 8F7C81
Harmonie kolorów
Komplementarna +180°
- FA1A8E
Philippine Pink
- 00A58E
≈ Brilliant Turquoise
Analogowa -30° +30°
- FA1A8E
Philippine Pink
- D93BDA
≈ Méi Gūi Zǐ Purple
- FF302D
≈ Pelati
Triada +120° +240°
- FA1A8E
Philippine Pink
- 879900
≈ BioShock
- 0098DA
≈ Atmosphere
Komplementarna rozszczepiona +150° +210°
- FA1A8E
Philippine Pink
- 00AB43
≈ Fennel Fiasco
- 00A0B1
≈ Breaking Wave
Tetrada +90° +180° +270°
- FA1A8E
Philippine Pink
- B08800
≈ Yellow Brown
- 00A58E
≈ Brilliant Turquoise
- 5D84FF
≈ Skinny Jeans
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.74:1 · APCA Lc 63
Ag
AANa czerni
WCAG 5.60:1 · APCA Lc 39
Najlepszy kolor tekstu: #000000
WCAG 5.60:1 (AA) · APCA Lc 39
Contrast pairs
Fragmenty kodu
CSS
:root {
--philippine-pink: #fa1a8e;
--philippine-pink-rgb: 250 26 142;
--philippine-pink-oklch: oklch(0.646 0.254 357.8);
}
.element {
color: var(--philippine-pink);
background-color: hsl(329 96% 54%);
border-color: oklch(0.646 0.254 357.8);
}Tailwind CSS v4
@theme {
--color-philippine-pink: #fa1a8e;
--color-philippine-pink-50: #ffd7f2;
--color-philippine-pink-100: #ffc4e5;
--color-philippine-pink-200: #ffa3d0;
--color-philippine-pink-300: #ff76b3;
--color-philippine-pink-400: #ff439e;
--color-philippine-pink-500: #f90086;
--color-philippine-pink-600: #d20071;
--color-philippine-pink-700: #a9005b;
--color-philippine-pink-800: #7e0045;
--color-philippine-pink-900: #590030;
--color-philippine-pink-950: #3c001c;
}SCSS
$philippine-pink: #fa1a8e;
$philippine-pink-rgb: 250, 26, 142;
$philippine-pink-light: mix(#fff, $philippine-pink, 20%);
$philippine-pink-dark: mix(#000, $philippine-pink, 20%);
.element {
color: $philippine-pink;
box-shadow: 0 0 0 2px rgba($philippine-pink, 0.35);
}