Nazwany kolor · #C4C5BA
Grey Ashlar
Grey Ashlar to #C4C5BA: rgb(196 197 186), hsl(65 9% 75%), oklch(0.82 0.015 110.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Grey Ashlar color name →
#C4C5BA
oklch(0.82 0.015 110.9)
Konwersje koloru
- HEX
- #c4c5ba
- RGB
- rgb(196 197 186)
- HSL
- hsl(65 9% 75%)
- HWB
- hwb(65 73% 23%)
- OKLCH
- oklch(0.82 0.015 110.9)
- OKLab
- oklab(0.82 -0.005 0.014)
- CIE Lab
- lab(79.21 -1.83 5.41)
- LCH
- lch(79.21 5.71 108.7)
- CMYK
- cmyk(1% 0% 6% 23%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- CACBC1
- D0D0C7
- D5D6CE
- DBDCD5
- E1E2DC
- E7E7E3
- EDEDEA
- F3F3F1
- F9F9F8
Odcienie ciemniejsze
- AAABA1
- 919289
- 787972
- 61615C
- 4A4B46
- 353532
- 21211E
- 0E0E0D
- 020202
Tony
- BDBEB4
- B6B7AE
- AFB0A8
- A8A9A2
- A1A29D
- 9B9B97
- 949491
- 8D8D8B
- 878786
Harmonie kolorów
Komplementarna +180°
- C4C5BA
Grey Ashlar
- C4C2CD
≈ Satire
Analogowa -30° +30°
- C4C5BA
Grey Ashlar
- C9C3B9
≈ Pavestone
- BFC7BD
≈ Tree Pose
Triada +120° +240°
- C4C5BA
Grey Ashlar
- BBC6CC
≈ Flowing Breeze
- CCC0C5
≈ Elusive Dream
Komplementarna rozszczepiona +150° +210°
- C4C5BA
Grey Ashlar
- BEC4CE
≈ Blue Dolphin
- C9C1CA
≈ Lavender Vapour
Tetrada +90° +180° +270°
- C4C5BA
Grey Ashlar
- B9C7C8
≈ Oceanic Climate
- C4C2CD
≈ Satire
- CEC0C0
≈ Dusky Violet
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.74:1 · APCA Lc 32
Ag
AAANa czerni
WCAG 12.04:1 · APCA Lc 71
Najlepszy kolor tekstu: #000000
WCAG 12.04:1 (AAA) · APCA Lc 71
Contrast pairs
Fragmenty kodu
CSS
:root {
--grey-ashlar: #c4c5ba;
--grey-ashlar-rgb: 196 197 186;
--grey-ashlar-oklch: oklch(0.82 0.015 110.9);
}
.element {
color: var(--grey-ashlar);
background-color: hsl(65 9% 75%);
border-color: oklch(0.82 0.015 110.9);
}Tailwind CSS v4
@theme {
--color-grey-ashlar: #c4c5ba;
--color-grey-ashlar-50: #f5f6f1;
--color-grey-ashlar-100: #e8e8e3;
--color-grey-ashlar-200: #d4d5ce;
--color-grey-ashlar-300: #b7b8b0;
--color-grey-ashlar-400: #9e9f95;
--color-grey-ashlar-500: #86877c;
--color-grey-ashlar-600: #727269;
--color-grey-ashlar-700: #5b5c54;
--color-grey-ashlar-800: #43433d;
--color-grey-ashlar-900: #2e2e2a;
--color-grey-ashlar-950: #1b1b17;
}SCSS
$grey-ashlar: #c4c5ba;
$grey-ashlar-rgb: 196, 197, 186;
$grey-ashlar-light: mix(#fff, $grey-ashlar, 20%);
$grey-ashlar-dark: mix(#000, $grey-ashlar, 20%);
.element {
color: $grey-ashlar;
box-shadow: 0 0 0 2px rgba($grey-ashlar, 0.35);
}