Named color · #A8ADC2
Upscale
Upscale is #A8ADC2: rgb(168 173 194), hsl(228 18% 71%), oklch(0.75 0.031 275). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Upscale color name →
#A8ADC2
oklch(0.75 0.031 275)
Color conversions
- HEX
- #a8adc2
- RGB
- rgb(168 173 194)
- HSL
- hsl(228 18% 71%)
- HWB
- hwb(228 66% 24%)
- OKLCH
- oklch(0.75 0.031 275)
- OKLab
- oklab(0.75 0.003 -0.03)
- CIE Lab
- lab(70.83 1.37 -11.4)
- LCH
- lch(70.83 11.48 276.9)
- CMYK
- cmyk(13% 11% 0% 24%)
Tints · Shades · Tones
Tints
- B0B5C8
- B9BDCE
- C1C5D4
- CACDDA
- D3D5E0
- DBDEE6
- E4E6ED
- EDEEF3
- F6F7F9
Shades
- 9296A8
- 7C7F8F
- 676A77
- 525560
- 3F4149
- 2C2D34
- 1A1B20
- 0A0B0E
- 010102
Tones
- A4A8BB
- A0A4B4
- 9C9FAE
- 989BA7
- 9496A1
- 90929A
- 8C8D93
- 88898D
- 848486
Color harmonies
Complementary +180°
- A8ADC2
Upscale
- B4AE99
≈ Soothing Sage
Analogous -30° +30°
- A8ADC2
Upscale
- 9FB1C1
≈ Blue Pot
- B2AABE
≈ Wisteria Trellis
Triadic +120° +240°
- A8ADC2
Upscale
- C1A8A1
≈ Sable Cloaked
- A0B4A6
≈ Frosty Green
Split-complementary +150° +210°
- A8ADC2
Upscale
- BCAB9A
≈ Delicate Honeysweet
- A9B29D
≈ Gargoyle
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 2.22:1 · APCA Lc 44
Ag
AAAOn black
WCAG 9.42:1 · APCA Lc 58
Best text color: #000000
WCAG 9.42:1 (AAA) · APCA Lc 58
Contrast pairs
Code snippets
CSS
:root {
--upscale: #a8adc2;
--upscale-rgb: 168 173 194;
--upscale-oklch: oklch(0.75 0.031 275);
}
.element {
color: var(--upscale);
background-color: hsl(228 18% 71%);
border-color: oklch(0.75 0.031 275);
}Tailwind CSS v4
@theme {
--color-upscale: #a8adc2;
--color-upscale-50: #f3f5fe;
--color-upscale-100: #e5e7f2;
--color-upscale-200: #d1d3e2;
--color-upscale-300: #b3b6c7;
--color-upscale-400: #999db1;
--color-upscale-500: #80859b;
--color-upscale-600: #6c7183;
--color-upscale-700: #575a69;
--color-upscale-800: #3f424d;
--color-upscale-900: #2b2d36;
--color-upscale-950: #181a21;
}SCSS
$upscale: #a8adc2;
$upscale-rgb: 168, 173, 194;
$upscale-light: mix(#fff, $upscale, 20%);
$upscale-dark: mix(#000, $upscale, 20%);
.element {
color: $upscale;
box-shadow: 0 0 0 2px rgba($upscale, 0.35);
}