Benannte Farbe · #687F7A
Aspen Valley
Aspen Valley ist #687F7A: rgb(104 127 122), hsl(167 10% 45%), oklch(0.577 0.028 180.6). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Aspen Valley color name →
#687F7A
oklch(0.577 0.028 180.6)
Farbumrechnungen
- HEX
- #687f7a
- RGB
- rgb(104 127 122)
- HSL
- hsl(167 10% 45%)
- HWB
- hwb(167 41% 50%)
- OKLCH
- oklch(0.577 0.028 180.6)
- OKLab
- oklab(0.577 -0.028 0)
- CIE Lab
- lab(51.24 -9.48 -0.2)
- LCH
- lch(51.24 9.49 181.2)
- CMYK
- cmyk(18% 0% 4% 50%)
Tints · Shades · Tones
Tints
- 768B86
- 859793
- 93A4A0
- A2B0AD
- B1BDBA
- C0CAC8
- D0D7D5
- DFE4E3
- EFF2F1
Shades
- 596E69
- 4B5D59
- 3E4C49
- 303C3A
- 242D2B
- 181F1D
- 0C1110
- 040605
- 000101
Tones
- 6B7F7B
- 6D7F7B
- 6F7F7C
- 727F7C
- 74807D
- 77807E
- 79807E
- 7B807F
- 7E807F
Farbharmonien
Komplementär +180°
- 687F7A
Aspen Valley
- 887378
≈ Choo Choo
Analog -30° +30°
- 687F7A
Aspen Valley
- 6E7E71
≈ Island Palm
- 677E83
≈ Catfish
Triadisch +120° +240°
- 687F7A
Aspen Valley
- 7C7688
≈ Dull Mauve
- 867669
≈ Gosling
Geteilt komplementär +150° +210°
- 687F7A
Aspen Valley
- 837481
≈ Faded Orchid
- 897470
≈ Soft Bark
Tetradisch +90° +180° +270°
- 687F7A
Aspen Valley
- 73798A
≈ Abandoned Spaceship
- 887378
≈ Choo Choo
- 7F7967
≈ Centre Ridge
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 4.28:1 · APCA Lc 70
Ag
AAAuf Schwarz
WCAG 4.90:1 · APCA Lc 32
Beste Textfarbe: #000000
WCAG 4.90:1 (AA) · APCA Lc 32
Contrast pairs
Code-Snippets
CSS
:root {
--aspen-valley: #687f7a;
--aspen-valley-rgb: 104 127 122;
--aspen-valley-oklch: oklch(0.577 0.028 180.6);
}
.element {
color: var(--aspen-valley);
background-color: hsl(167 10% 45%);
border-color: oklch(0.577 0.028 180.6);
}Tailwind CSS v4
@theme {
--color-aspen-valley: #687f7a;
--color-aspen-valley-50: #edf8f6;
--color-aspen-valley-100: #deebe8;
--color-aspen-valley-200: #c8d8d5;
--color-aspen-valley-300: #a9bcb8;
--color-aspen-valley-400: #8da49f;
--color-aspen-valley-500: #738d87;
--color-aspen-valley-600: #617772;
--color-aspen-valley-700: #4e5f5b;
--color-aspen-valley-800: #384642;
--color-aspen-valley-900: #27302e;
--color-aspen-valley-950: #151c1b;
}SCSS
$aspen-valley: #687f7a;
$aspen-valley-rgb: 104, 127, 122;
$aspen-valley-light: mix(#fff, $aspen-valley, 20%);
$aspen-valley-dark: mix(#000, $aspen-valley, 20%);
.element {
color: $aspen-valley;
box-shadow: 0 0 0 2px rgba($aspen-valley, 0.35);
}