Benannte Farbe · #8A877B
Compass
Compass ist #8A877B: rgb(138 135 123), hsl(48 6% 51%), oklch(0.622 0.018 95.4). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Compass color name →
#8A877B
oklch(0.622 0.018 95.4)
Farbumrechnungen
- HEX
- #8a877b
- RGB
- rgb(138 135 123)
- HSL
- hsl(48 6% 51%)
- HWB
- hwb(48 48% 46%)
- OKLCH
- oklch(0.622 0.018 95.4)
- OKLab
- oklab(0.622 -0.002 0.018)
- CIE Lab
- lab(56.31 -0.5 6.9)
- LCH
- lch(56.31 6.92 94.1)
- CMYK
- cmyk(0% 2% 11% 46%)
Tints · Shades · Tones
Tints
- 959287
- A09E94
- ACAAA1
- B7B5AE
- C3C1BB
- CFCDC8
- DBDAD6
- E7E6E3
- F3F2F1
Shades
- 77756A
- 65635A
- 53514A
- 42413A
- 32312C
- 22211E
- 141310
- 070605
- 010101
Tones
- 89867C
- 88867C
- 87857D
- 86847D
- 85847E
- 84837E
- 83827F
- 82817F
- 818180
Farbharmonien
Komplementär +180°
- 8A877B
Compass
- 838692
≈ Modest Mauve
Analog -30° +30°
- 8A877B
Compass
- 8F857C
≈ Wild Wilderness
- 84897D
≈ Turtle Bay
Triadisch +120° +240°
- 8A877B
Compass
- 7B8A8E
≈ Academy Grey
- 8E838B
≈ Lost Lavender Somewhere
Geteilt komplementär +150° +210°
- 8A877B
Compass
- 7E8891
≈ Sea Lion
- 898490
≈ Old Amethyst
Tetradisch +90° +180° +270°
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.60:1 · APCA Lc 64
Ag
AAAuf Schwarz
WCAG 5.83:1 · APCA Lc 38
Beste Textfarbe: #000000
WCAG 5.83:1 (AA) · APCA Lc 38
Contrast pairs
Code-Snippets
CSS
:root {
--compass: #8a877b;
--compass-rgb: 138 135 123;
--compass-oklch: oklch(0.622 0.018 95.4);
}
.element {
color: var(--compass);
background-color: hsl(48 6% 51%);
border-color: oklch(0.622 0.018 95.4);
}Tailwind CSS v4
@theme {
--color-compass: #8a877b;
--color-compass-50: #f6f5ef;
--color-compass-100: #e9e8e1;
--color-compass-200: #d6d4cc;
--color-compass-300: #bab8ad;
--color-compass-400: #a19f93;
--color-compass-500: #8a8679;
--color-compass-600: #747267;
--color-compass-700: #5d5b52;
--color-compass-800: #44423b;
--color-compass-900: #2f2e29;
--color-compass-950: #1c1b17;
}SCSS
$compass: #8a877b;
$compass-rgb: 138, 135, 123;
$compass-light: mix(#fff, $compass, 20%);
$compass-dark: mix(#000, $compass, 20%);
.element {
color: $compass;
box-shadow: 0 0 0 2px rgba($compass, 0.35);
}