Colore con nome · #F7B6BA
Ballerina Pink
Ballerina Pink è #F7B6BA: rgb(247 182 186), hsl(356 80% 84%), oklch(0.837 0.076 14.7). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Pink mean? → · Ballerina Pink color name →
#F7B6BA
oklch(0.837 0.076 14.7)
Conversioni di colore
- HEX
- #f7b6ba
- RGB
- rgb(247 182 186)
- HSL
- hsl(356 80% 84%)
- HWB
- hwb(356 71% 3%)
- OKLCH
- oklch(0.837 0.076 14.7)
- OKLab
- oklab(0.837 0.073 0.019)
- CIE Lab
- lab(80.3 24.68 7.74)
- LCH
- lch(80.3 25.87 17.4)
- CMYK
- cmyk(0% 26% 25% 3%)
Tinte · Ombre · Toni
Tinte
- F8BDC1
- FAC5C8
- FBCCCE
- FCD3D5
- FDDBDC
- FDE2E3
- FEE9EA
- FEF0F1
- FFF8F8
Ombre
- D79EA1
- B78689
- 996F72
- 7C595C
- 604446
- 453032
- 2C1D1E
- 150C0D
- 030202
Toni
- EBB1B4
- DFABAE
- D3A6A8
- C7A0A2
- BB9B9D
- AF9697
- A39091
- 978B8B
- 8C8586
Armonie di colore
Complementare +180°
- F7B6BA
Ballerina Pink
- 8DDAD9
≈ Island Oasis
Analogo -30° +30°
- F7B6BA
Ballerina Pink
- EEB6D5
≈ Soft Cashmere
- F5BBA1
≈ Certain Peach
Triadico +120° +240°
- F7B6BA
Ballerina Pink
- B5D5A3
≈ In Good Taste
- A9CDFB
≈ Night Snow
Complementare divisa +150° +210°
- F7B6BA
Ballerina Pink
- 9BDABD
≈ Green Jewel
- 93D5EF
≈ Blue Effervescence
Tetradico +90° +180° +270°
- F7B6BA
Ballerina Pink
- D1CD93
≈ Corn Husk Green
- 8DDAD9
≈ Island Oasis
- C4C3FA
≈ Light Periwinkle
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.69:1 · APCA Lc 30
Ag
AAASu nero
WCAG 12.35:1 · APCA Lc 73
Miglior colore del testo: #000000
WCAG 12.35:1 (AAA) · APCA Lc 73
Contrast pairs
Frammenti di codice
CSS
:root {
--ballerina-pink: #f7b6ba;
--ballerina-pink-rgb: 247 182 186;
--ballerina-pink-oklch: oklch(0.837 0.076 14.7);
}
.element {
color: var(--ballerina-pink);
background-color: hsl(356 80% 84%);
border-color: oklch(0.837 0.076 14.7);
}Tailwind CSS v4
@theme {
--color-ballerina-pink: #f7b6ba;
--color-ballerina-pink-50: #ffeded;
--color-ballerina-pink-100: #ffdedf;
--color-ballerina-pink-200: #f3c8c9;
--color-ballerina-pink-300: #dca8aa;
--color-ballerina-pink-400: #c78c90;
--color-ballerina-pink-500: #b37176;
--color-ballerina-pink-600: #976064;
--color-ballerina-pink-700: #794d50;
--color-ballerina-pink-800: #5a373b;
--color-ballerina-pink-900: #3f2628;
--color-ballerina-pink-950: #281416;
}SCSS
$ballerina-pink: #f7b6ba;
$ballerina-pink-rgb: 247, 182, 186;
$ballerina-pink-light: mix(#fff, $ballerina-pink, 20%);
$ballerina-pink-dark: mix(#000, $ballerina-pink, 20%);
.element {
color: $ballerina-pink;
box-shadow: 0 0 0 2px rgba($ballerina-pink, 0.35);
}