Nazwany kolor · #EAACC6
Pink Macaroon
Pink Macaroon to #EAACC6: rgb(234 172 198), hsl(335 60% 80%), oklch(0.81 0.08 352.1). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Pink mean? → · Pink Macaroon color name →
#EAACC6
oklch(0.81 0.08 352.1)
Konwersje koloru
- HEX
- #eaacc6
- RGB
- rgb(234 172 198)
- HSL
- hsl(335 60% 80%)
- HWB
- hwb(335 67% 8%)
- OKLCH
- oklch(0.81 0.08 352.1)
- OKLab
- oklab(0.81 0.079 -0.011)
- CIE Lab
- lab(76.86 26.23 -3.87)
- LCH
- lch(76.86 26.51 351.6)
- CMYK
- cmyk(0% 26% 15% 8%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- EDB4CC
- EFBDD1
- F1C5D7
- F4CDDD
- F6D5E2
- F8DEE8
- FAE6EE
- FCEEF3
- FDF7F9
Odcienie ciemniejsze
- CB95AC
- AE7F92
- 91697A
- 755462
- 5A404B
- 412D35
- 291B21
- 130B0E
- 030102
Tony
- DFA8BF
- D4A3B8
- CA9FB0
- BF9BA9
- B596A2
- AA929B
- 9F8D94
- 95898E
- 8A8487
Harmonie kolorów
Komplementarna +180°
- EAACC6
Pink Macaroon
- 8AD2BB
≈ Tropical Trail
Analogowa -30° +30°
- EAACC6
Pink Macaroon
- DAB0E0
≈ Whisper of Plum
- F0ADAA
≈ Pressed Rose
Triada +120° +240°
- EAACC6
Pink Macaroon
- C1C68B
≈ Misty Valley
- 8BCAEC
≈ Airy Blue
Komplementarna rozszczepiona +150° +210°
- EAACC6
Pink Macaroon
- A4CE9F
≈ Mover & Shaker
- 80D0D7
≈ Sea of Tranquillity
Tetrada +90° +180° +270°
- EAACC6
Pink Macaroon
- DBBC85
≈ Brown Rice
- 8AD2BB
≈ Tropical Trail
- A5C1F5
≈ Sky High
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.87:1 · APCA Lc 35
Ag
AAANa czerni
WCAG 11.21:1 · APCA Lc 67
Najlepszy kolor tekstu: #000000
WCAG 11.21:1 (AAA) · APCA Lc 67
Contrast pairs
Fragmenty kodu
CSS
:root {
--pink-macaroon: #eaacc6;
--pink-macaroon-rgb: 234 172 198;
--pink-macaroon-oklch: oklch(0.81 0.08 352.1);
}
.element {
color: var(--pink-macaroon);
background-color: hsl(335 60% 80%);
border-color: oklch(0.81 0.08 352.1);
}Tailwind CSS v4
@theme {
--color-pink-macaroon: #eaacc6;
--color-pink-macaroon-50: #ffecf7;
--color-pink-macaroon-100: #ffdeea;
--color-pink-macaroon-200: #f1c7d6;
--color-pink-macaroon-300: #d9a7ba;
--color-pink-macaroon-400: #c48ba3;
--color-pink-macaroon-500: #af708c;
--color-pink-macaroon-600: #945f76;
--color-pink-macaroon-700: #774c5e;
--color-pink-macaroon-800: #573746;
--color-pink-macaroon-900: #3d2531;
--color-pink-macaroon-950: #26141d;
}SCSS
$pink-macaroon: #eaacc6;
$pink-macaroon-rgb: 234, 172, 198;
$pink-macaroon-light: mix(#fff, $pink-macaroon, 20%);
$pink-macaroon-dark: mix(#000, $pink-macaroon, 20%);
.element {
color: $pink-macaroon;
box-shadow: 0 0 0 2px rgba($pink-macaroon, 0.35);
}