Nazwany kolor · #C89EB7
Idyllic Pink
Idyllic Pink to #C89EB7: rgb(200 158 183), hsl(324 28% 70%), oklch(0.745 0.06 342.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Pink mean? → · Idyllic Pink color name →
#C89EB7
oklch(0.745 0.06 342.2)
Konwersje koloru
- HEX
- #c89eb7
- RGB
- rgb(200 158 183)
- HSL
- hsl(324 28% 70%)
- HWB
- hwb(324 62% 22%)
- OKLCH
- oklch(0.745 0.06 342.2)
- OKLab
- oklab(0.745 0.057 -0.018)
- CIE Lab
- lab(69.63 19.08 -6.72)
- LCH
- lch(69.63 20.23 340.6)
- CMYK
- cmyk(0% 21% 8% 22%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- CEA7BE
- D3B1C5
- D9BACC
- DEC4D3
- E4CEDB
- E9D7E2
- EFE1E9
- F4EBF0
- FAF5F8
Odcienie ciemniejsze
- AE899F
- 947487
- 7B6070
- 634D5A
- 4C3A45
- 362931
- 21181E
- 0F090C
- 020102
Tony
- C19BB1
- B998AC
- B295A6
- AB92A1
- A48F9B
- 9D8C96
- 958990
- 8E868B
- 878385
Harmonie kolorów
Komplementarna +180°
- C89EB7
Idyllic Pink
- 8BB9A1
≈ Greyed Jade
Analogowa -30° +30°
- C89EB7
Idyllic Pink
- B9A2C8
≈ Violet Fields
- CF9DA2
≈ Edwardian Rose
Triada +120° +240°
- C89EB7
Idyllic Pink
- B3AE83
≈ Lively Ivy
- 82B6C8
≈ Crystal Lake
Komplementarna rozszczepiona +150° +210°
- C89EB7
Idyllic Pink
- 9EB58E
≈ Haven
- 7FB9B6
≈ Vintage Blue
Tetrada +90° +180° +270°
- C89EB7
Idyllic Pink
- C4A783
≈ Pocket Watch
- 8BB9A1
≈ Greyed Jade
- 92AFD2
≈ Lazy Day
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.32:1 · APCA Lc 46
Ag
AAANa czerni
WCAG 9.03:1 · APCA Lc 56
Najlepszy kolor tekstu: #000000
WCAG 9.03:1 (AAA) · APCA Lc 56
Contrast pairs
Fragmenty kodu
CSS
:root {
--idyllic-pink: #c89eb7;
--idyllic-pink-rgb: 200 158 183;
--idyllic-pink-oklch: oklch(0.745 0.06 342.2);
}
.element {
color: var(--idyllic-pink);
background-color: hsl(324 28% 70%);
border-color: oklch(0.745 0.06 342.2);
}Tailwind CSS v4
@theme {
--color-idyllic-pink: #c89eb7;
--color-idyllic-pink-50: #ffeff9;
--color-idyllic-pink-100: #f7e0ed;
--color-idyllic-pink-200: #e8cbda;
--color-idyllic-pink-300: #cfacbf;
--color-idyllic-pink-400: #b891a8;
--color-idyllic-pink-500: #a27791;
--color-idyllic-pink-600: #89657b;
--color-idyllic-pink-700: #6e5062;
--color-idyllic-pink-800: #513a49;
--color-idyllic-pink-900: #382832;
--color-idyllic-pink-950: #23161e;
}SCSS
$idyllic-pink: #c89eb7;
$idyllic-pink-rgb: 200, 158, 183;
$idyllic-pink-light: mix(#fff, $idyllic-pink, 20%);
$idyllic-pink-dark: mix(#000, $idyllic-pink, 20%);
.element {
color: $idyllic-pink;
box-shadow: 0 0 0 2px rgba($idyllic-pink, 0.35);
}