Nazwany kolor · #DC9F9F
Pink Pussycat
Pink Pussycat to #DC9F9F: rgb(220 159 159), hsl(0 47% 74%), oklch(0.761 0.073 18.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Pink Pussycat color name →
#DC9F9F
oklch(0.761 0.073 18.9)
Konwersje koloru
- HEX
- #dc9f9f
- RGB
- rgb(220 159 159)
- HSL
- hsl(0 47% 74%)
- HWB
- hwb(0 62% 14%)
- OKLCH
- oklch(0.761 0.073 18.9)
- OKLab
- oklab(0.761 0.069 0.024)
- CIE Lab
- lab(71.47 23.37 9.48)
- LCH
- lch(71.47 25.22 22.1)
- CMYK
- cmyk(0% 28% 28% 14%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- E0A8A8
- E4B2B2
- E8BBBB
- EBC5C5
- EFCFCE
- F2D8D8
- F6E2E1
- F9ECEB
- FCF5F5
Odcienie ciemniejsze
- BF8A8A
- A37575
- 886161
- 6E4D4D
- 543B3B
- 3C2929
- 261818
- 110909
- 020101
Tony
- D39C9C
- CA9999
- C09696
- B79393
- AE908F
- A58D8C
- 9C8A89
- 928686
- 898383
Harmonie kolorów
Komplementarna +180°
- DC9F9F
Pink Pussycat
- 77C0C3
≈ Pure Turquoise
Analogowa -30° +30°
- DC9F9F
Pink Pussycat
- D59FB9
≈ Gizmo
- D8A489
≈ Shetland Pony
Triada +120° +240°
- DC9F9F
Pink Pussycat
- 9ABD90
≈ Milly Green
- 95B3E0
≈ Echo Isles Water
Komplementarna rozszczepiona +150° +210°
- DC9F9F
Pink Pussycat
- 82C1A9
≈ Gauss Blaster Green
- 7FBBD6
≈ Petit Four
Tetrada +90° +180° +270°
- DC9F9F
Pink Pussycat
- B5B67F
≈ Fancy Flirt
- 77C0C3
≈ Pure Turquoise
- AFAADD
≈ Maximum Blue Purple
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.20:1 · APCA Lc 43
Ag
AAANa czerni
WCAG 9.50:1 · APCA Lc 59
Najlepszy kolor tekstu: #000000
WCAG 9.50:1 (AAA) · APCA Lc 59
Contrast pairs
Fragmenty kodu
CSS
:root {
--pink-pussycat: #dc9f9f;
--pink-pussycat-rgb: 220 159 159;
--pink-pussycat-oklch: oklch(0.761 0.073 18.9);
}
.element {
color: var(--pink-pussycat);
background-color: hsl(0 47% 74%);
border-color: oklch(0.761 0.073 18.9);
}Tailwind CSS v4
@theme {
--color-pink-pussycat: #dc9f9f;
--color-pink-pussycat-50: #ffedec;
--color-pink-pussycat-100: #ffdfdd;
--color-pink-pussycat-200: #f2c9c7;
--color-pink-pussycat-300: #dba9a7;
--color-pink-pussycat-400: #c68d8d;
--color-pink-pussycat-500: #b27273;
--color-pink-pussycat-600: #966161;
--color-pink-pussycat-700: #784d4e;
--color-pink-pussycat-800: #593839;
--color-pink-pussycat-900: #3e2627;
--color-pink-pussycat-950: #271415;
}SCSS
$pink-pussycat: #dc9f9f;
$pink-pussycat-rgb: 220, 159, 159;
$pink-pussycat-light: mix(#fff, $pink-pussycat, 20%);
$pink-pussycat-dark: mix(#000, $pink-pussycat, 20%);
.element {
color: $pink-pussycat;
box-shadow: 0 0 0 2px rgba($pink-pussycat, 0.35);
}