Nazwany kolor · #9A9E88
Flagstone Quartzite
Flagstone Quartzite to #9A9E88: rgb(154 158 136), hsl(71 10% 58%), oklch(0.69 0.032 115.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Flagstone Quartzite color name →
#9A9E88
oklch(0.69 0.032 115.6)
Konwersje koloru
- HEX
- #9a9e88
- RGB
- rgb(154 158 136)
- HSL
- hsl(71 10% 58%)
- HWB
- hwb(71 53% 38%)
- OKLCH
- oklch(0.69 0.032 115.6)
- OKLab
- oklab(0.69 -0.014 0.029)
- CIE Lab
- lab(64.32 -4.48 11.03)
- LCH
- lch(64.32 11.9 112.1)
- CMYK
- cmyk(3% 0% 14% 38%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- A4A793
- ADB19F
- B7BAAA
- C1C4B6
- CBCDC2
- D5D7CE
- E0E1DA
- EAEBE6
- F4F5F3
Odcienie ciemniejsze
- 858975
- 717463
- 5E6052
- 4B4D41
- 393A31
- 272922
- 171813
- 090906
- 010101
Tony
- 979B87
- 959887
- 929586
- 8F9285
- 8D8F84
- 8A8C83
- 888983
- 858682
- 838381
Harmonie kolorów
Komplementarna +180°
- 9A9E88
Flagstone Quartzite
- 9C98AD
≈ Bay Fog
Analogowa -30° +30°
- 9A9E88
Flagstone Quartzite
- A49A85
≈ Churchill Downs
- 8FA190
≈ Hillside View
Triada +120° +240°
- 9A9E88
Flagstone Quartzite
- 899FAC
≈ Sonata Blue
- AC949C
≈ Legendary Lilac
Komplementarna rozszczepiona +150° +210°
- 9A9E88
Flagstone Quartzite
- 929BB0
≈ Ornamental Silver
- A695A6
≈ Windsor Haze
Tetrada +90° +180° +270°
- 9A9E88
Flagstone Quartzite
- 85A1A5
≈ Tourmaline
- 9C98AD
≈ Bay Fog
- AE9491
≈ Antoinette
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.75:1 · APCA Lc 53
Ag
AAANa czerni
WCAG 7.62:1 · APCA Lc 49
Najlepszy kolor tekstu: #000000
WCAG 7.62:1 (AAA) · APCA Lc 49
Contrast pairs
Fragmenty kodu
CSS
:root {
--flagstone-quartzite: #9a9e88;
--flagstone-quartzite-rgb: 154 158 136;
--flagstone-quartzite-oklch: oklch(0.69 0.032 115.6);
}
.element {
color: var(--flagstone-quartzite);
background-color: hsl(71 10% 58%);
border-color: oklch(0.69 0.032 115.6);
}Tailwind CSS v4
@theme {
--color-flagstone-quartzite: #9a9e88;
--color-flagstone-quartzite-50: #f4f6ec;
--color-flagstone-quartzite-100: #e7e9de;
--color-flagstone-quartzite-200: #d3d6c7;
--color-flagstone-quartzite-300: #b6baa8;
--color-flagstone-quartzite-400: #9da18c;
--color-flagstone-quartzite-500: #858971;
--color-flagstone-quartzite-600: #707460;
--color-flagstone-quartzite-700: #5a5d4d;
--color-flagstone-quartzite-800: #424437;
--color-flagstone-quartzite-900: #2e2f26;
--color-flagstone-quartzite-950: #1a1b14;
}SCSS
$flagstone-quartzite: #9a9e88;
$flagstone-quartzite-rgb: 154, 158, 136;
$flagstone-quartzite-light: mix(#fff, $flagstone-quartzite, 20%);
$flagstone-quartzite-dark: mix(#000, $flagstone-quartzite, 20%);
.element {
color: $flagstone-quartzite;
box-shadow: 0 0 0 2px rgba($flagstone-quartzite, 0.35);
}