Colore con nome · #F3C6CC
Energetic Pink
Energetic Pink è #F3C6CC: rgb(243 198 204), hsl(352 65% 86%), oklch(0.867 0.052 9.2). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Pink mean? → · Energetic Pink color name →
#F3C6CC
oklch(0.867 0.052 9.2)
Conversioni di colore
- HEX
- #f3c6cc
- RGB
- rgb(243 198 204)
- HSL
- hsl(352 65% 86%)
- HWB
- hwb(352 78% 5%)
- OKLCH
- oklch(0.867 0.052 9.2)
- OKLab
- oklab(0.867 0.051 0.008)
- CIE Lab
- lab(84.01 17.16 3.36)
- LCH
- lch(84.01 17.48 11.1)
- CMYK
- cmyk(0% 19% 16% 5%)
Tinte · Ombre · Toni
Tinte
- F4CCD1
- F6D1D6
- F7D7DB
- F8DDE0
- FAE2E5
- FBE8EA
- FCEEEF
- FDF4F5
- FEF9FA
Ombre
- D3ACB1
- B49297
- 977A7E
- 7A6265
- 5E4B4E
- 443537
- 2B2122
- 140E0F
- 030202
Toni
- E7BFC4
- DBB8BC
- D0B1B5
- C4A9AD
- B8A2A5
- AD9B9E
- A29596
- 968E8F
- 8B8787
Armonie di colore
Complementare +180°
- F3C6CC
Energetic Pink
- ADDFDA
≈ Blue Light
Analogo -30° +30°
- F3C6CC
Energetic Pink
- EBC7DF
≈ Pink Pony
- F3C9BB
≈ Sweet Angel
Triadico +120° +240°
- F3C6CC
Energetic Pink
- C9DBB7
≈ Pallid Light Green
- BAD7F5
≈ Oh Boy!
Complementare divisa +150° +210°
- F3C6CC
Energetic Pink
- B7DEC7
≈ Aqua Bay
- AEDCEB
≈ Lady-In-Waiting
Tetradico +90° +180° +270°
- F3C6CC
Energetic Pink
- DBD5AE
≈ Morning Moor
- ADDFDA
≈ Blue Light
- CCD1F6
≈ Frozen Periwinkle
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.52:1 · APCA Lc 24
Ag
AAASu nero
WCAG 13.76:1 · APCA Lc 79
Miglior colore del testo: #000000
WCAG 13.76:1 (AAA) · APCA Lc 79
Contrast pairs
Frammenti di codice
CSS
:root {
--energetic-pink: #f3c6cc;
--energetic-pink-rgb: 243 198 204;
--energetic-pink-oklch: oklch(0.867 0.052 9.2);
}
.element {
color: var(--energetic-pink);
background-color: hsl(352 65% 86%);
border-color: oklch(0.867 0.052 9.2);
}Tailwind CSS v4
@theme {
--color-energetic-pink: #f3c6cc;
--color-energetic-pink-50: #ffeff1;
--color-energetic-pink-100: #f9e1e3;
--color-energetic-pink-200: #e9cccf;
--color-energetic-pink-300: #d0adb1;
--color-energetic-pink-400: #bb9298;
--color-energetic-pink-500: #a5787f;
--color-energetic-pink-600: #8c666b;
--color-energetic-pink-700: #705156;
--color-energetic-pink-800: #523b3f;
--color-energetic-pink-900: #39282b;
--color-energetic-pink-950: #241619;
}SCSS
$energetic-pink: #f3c6cc;
$energetic-pink-rgb: 243, 198, 204;
$energetic-pink-light: mix(#fff, $energetic-pink, 20%);
$energetic-pink-dark: mix(#000, $energetic-pink, 20%);
.element {
color: $energetic-pink;
box-shadow: 0 0 0 2px rgba($energetic-pink, 0.35);
}