Nazwany kolor · #C9B0AB
Insightful Rose
Insightful Rose to #C9B0AB: rgb(201 176 171), hsl(10 22% 73%), oklch(0.777 0.03 31.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Insightful Rose color name →
#C9B0AB
oklch(0.777 0.03 31.2)
Konwersje koloru
- HEX
- #c9b0ab
- RGB
- rgb(201 176 171)
- HSL
- hsl(10 22% 73%)
- HWB
- hwb(10 67% 21%)
- OKLCH
- oklch(0.777 0.03 31.2)
- OKLab
- oklab(0.777 0.026 0.015)
- CIE Lab
- lab(73.93 8.7 6.06)
- LCH
- lch(73.93 10.6 34.8)
- CMYK
- cmyk(0% 12% 15% 21%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- CEB8B3
- D4BFBB
- D9C7C4
- DFCFCC
- E4D7D4
- E9DFDD
- EFE7E5
- F4EFEE
- FAF7F6
Odcienie ciemniejsze
- AE9994
- 95827E
- 7C6C68
- 645654
- 4C4240
- 362E2D
- 221C1B
- 0F0B0B
- 020101
Tony
- C2ABA7
- BAA6A2
- B3A19E
- AB9D9A
- A49895
- 9D9391
- 958E8D
- 8E8988
- 878584
Harmonie kolorów
Komplementarna +180°
- C9B0AB
Insightful Rose
- A2BCC1
≈ Soft Shore
Analogowa -30° +30°
- C9B0AB
Insightful Rose
- C8AFB5
≈ Calm Cupid
- C5B3A4
≈ Steveareno Beige
Triada +120° +240°
- C9B0AB
Insightful Rose
- A9BCAD
≈ Rockfall
- AFB6CA
≈ Soul Sister
Komplementarna rozszczepiona +150° +210°
- C9B0AB
Insightful Rose
- A3BDB8
≈ Botanical Bliss
- A6B9C8
≈ Blue Tribute
Tetrada +90° +180° +270°
- C9B0AB
Insightful Rose
- B3BAA5
≈ Matt Sage
- A2BCC1
≈ Soft Shore
- B9B2C7
≈ Bohemianism
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.04:1 · APCA Lc 40
Ag
AAANa czerni
WCAG 10.28:1 · APCA Lc 63
Najlepszy kolor tekstu: #000000
WCAG 10.28:1 (AAA) · APCA Lc 63
Contrast pairs
Fragmenty kodu
CSS
:root {
--insightful-rose: #c9b0ab;
--insightful-rose-rgb: 201 176 171;
--insightful-rose-oklch: oklch(0.777 0.03 31.2);
}
.element {
color: var(--insightful-rose);
background-color: hsl(10 22% 73%);
border-color: oklch(0.777 0.03 31.2);
}Tailwind CSS v4
@theme {
--color-insightful-rose: #c9b0ab;
--color-insightful-rose-50: #fef2f0;
--color-insightful-rose-100: #f2e5e1;
--color-insightful-rose-200: #e1d0cc;
--color-insightful-rose-300: #c6b2ae;
--color-insightful-rose-400: #af9894;
--color-insightful-rose-500: #997f7a;
--color-insightful-rose-600: #816c67;
--color-insightful-rose-700: #685653;
--color-insightful-rose-800: #4c3f3c;
--color-insightful-rose-900: #352b29;
--color-insightful-rose-950: #201817;
}SCSS
$insightful-rose: #c9b0ab;
$insightful-rose-rgb: 201, 176, 171;
$insightful-rose-light: mix(#fff, $insightful-rose, 20%);
$insightful-rose-dark: mix(#000, $insightful-rose, 20%);
.element {
color: $insightful-rose;
box-shadow: 0 0 0 2px rgba($insightful-rose, 0.35);
}