Nazwany kolor · #CAC9C0
Whitewash Oak
Whitewash Oak to #CAC9C0: rgb(202 201 192), hsl(54 9% 77%), oklch(0.834 0.012 101.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Whitewash Oak color name →
#CAC9C0
oklch(0.834 0.012 101.5)
Konwersje koloru
- HEX
- #cac9c0
- RGB
- rgb(202 201 192)
- HSL
- hsl(54 9% 77%)
- HWB
- hwb(54 75% 21%)
- OKLCH
- oklch(0.834 0.012 101.5)
- OKLab
- oklab(0.834 -0.002 0.012)
- CIE Lab
- lab(80.85 -0.84 4.64)
- LCH
- lch(80.85 4.72 100.2)
- CMYK
- cmyk(0% 0% 5% 21%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- CFCEC6
- D4D4CC
- DAD9D3
- DFDED9
- E4E4DF
- EAE9E5
- EFEFEC
- F4F4F2
- FAF9F9
Odcienie ciemniejsze
- AFAEA7
- 95958E
- 7C7C76
- 64645F
- 4D4C49
- 373634
- 222220
- 0F0F0E
- 020202
Tony
- C2C1B9
- BBBAB3
- B3B2AC
- ACABA6
- A4A49F
- 9D9C99
- 969593
- 8E8E8C
- 878786
Harmonie kolorów
Komplementarna +180°
- CAC9C0
Whitewash Oak
- C7C8D1
≈ Viola Ice Grey
Analogowa -30° +30°
- CAC9C0
Whitewash Oak
- CEC7C0
≈ Worldly Grey
- C6CAC2
≈ Moss Ink
Triada +120° +240°
- CAC9C0
Whitewash Oak
- C0CBCE
≈ Sleepy Blue
- CFC6CB
≈ Piano Grey Rose
Komplementarna rozszczepiona +150° +210°
- CAC9C0
Whitewash Oak
- C3C9D1
≈ Light Spirit
- CBC6CF
≈ Hazy Mauve
Tetrada +90° +180° +270°
- CAC9C0
Whitewash Oak
- C0CBCA
≈ Urban Raincoat
- C7C8D1
≈ Viola Ice Grey
- D0C5C6
≈ Mother of Pearl Pink
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.66:1 · APCA Lc 29
Ag
AAANa czerni
WCAG 12.62:1 · APCA Lc 74
Najlepszy kolor tekstu: #000000
WCAG 12.62:1 (AAA) · APCA Lc 74
Contrast pairs
Fragmenty kodu
CSS
:root {
--whitewash-oak: #cac9c0;
--whitewash-oak-rgb: 202 201 192;
--whitewash-oak-oklch: oklch(0.834 0.012 101.5);
}
.element {
color: var(--whitewash-oak);
background-color: hsl(54 9% 77%);
border-color: oklch(0.834 0.012 101.5);
}Tailwind CSS v4
@theme {
--color-whitewash-oak: #cac9c0;
--color-whitewash-oak-50: #f6f5f1;
--color-whitewash-oak-100: #e8e8e3;
--color-whitewash-oak-200: #d5d4cf;
--color-whitewash-oak-300: #b8b8b1;
--color-whitewash-oak-400: #a09f97;
--color-whitewash-oak-500: #88877d;
--color-whitewash-oak-600: #73726a;
--color-whitewash-oak-700: #5c5b55;
--color-whitewash-oak-800: #43423e;
--color-whitewash-oak-900: #2e2e2a;
--color-whitewash-oak-950: #1b1b18;
}SCSS
$whitewash-oak: #cac9c0;
$whitewash-oak-rgb: 202, 201, 192;
$whitewash-oak-light: mix(#fff, $whitewash-oak, 20%);
$whitewash-oak-dark: mix(#000, $whitewash-oak, 20%);
.element {
color: $whitewash-oak;
box-shadow: 0 0 0 2px rgba($whitewash-oak, 0.35);
}