Named color · #82889C
Top Shelf
Top Shelf is #82889C: rgb(130 136 156), hsl(226 12% 56%), oklch(0.629 0.031 272.3). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Top Shelf color name →
#82889C
oklch(0.629 0.031 272.3)
Color conversions
- HEX
- #82889c
- RGB
- rgb(130 136 156)
- HSL
- hsl(226 12% 56%)
- HWB
- hwb(226 51% 39%)
- OKLCH
- oklch(0.629 0.031 272.3)
- OKLab
- oklab(0.629 0.001 -0.031)
- CIE Lab
- lab(56.71 0.97 -11.49)
- LCH
- lch(56.71 11.53 274.8)
- CMYK
- cmyk(17% 13% 0% 39%)
Tints · Shades · Tones
Tints
- 8E93A6
- 9A9FAF
- A6AAB9
- B2B6C3
- BFC2CD
- CBCED7
- D8DAE1
- E5E6EB
- F2F3F5
Shades
- 707587
- 5F6373
- 4E525F
- 3E414C
- 2F3139
- 202228
- 121318
- 060609
- 010101
Tones
- 828799
- 828696
- 818694
- 818591
- 81848E
- 81838B
- 818288
- 808286
- 808183
Color harmonies
Complementary +180°
- 82889C
Top Shelf
- 8F8974
≈ Witch Hazel Leaf
Analogous -30° +30°
- 82889C
Top Shelf
- 798B9A
≈ Spartan Blue
- 8C8599
≈ Purple Ragwort
Triadic +120° +240°
- 82889C
Top Shelf
- 9B827D
≈ Mystere
- 7B8E80
≈ Cyanara
Split-complementary +150° +210°
- 82889C
Top Shelf
- 978576
≈ Toffee Fingers
- 858C78
≈ Aloe Thorn
Tetradic +90° +180° +270°
- 82889C
Top Shelf
- 9A8187
≈ Ordain
- 8F8974
≈ Witch Hazel Leaf
- 758F8A
≈ Gumbo
Contrast & accessibility
Ag
FailOn white
WCAG 3.52:1 · APCA Lc 63
Ag
AAOn black
WCAG 5.95:1 · APCA Lc 39
Best text color: #000000
WCAG 5.95:1 (AA) · APCA Lc 39
Contrast pairs
Code snippets
CSS
:root {
--top-shelf: #82889c;
--top-shelf-rgb: 130 136 156;
--top-shelf-oklch: oklch(0.629 0.031 272.3);
}
.element {
color: var(--top-shelf);
background-color: hsl(226 12% 56%);
border-color: oklch(0.629 0.031 272.3);
}Tailwind CSS v4
@theme {
--color-top-shelf: #82889c;
--color-top-shelf-50: #f2f5fe;
--color-top-shelf-100: #e4e7f3;
--color-top-shelf-200: #d0d4e2;
--color-top-shelf-300: #b2b7c8;
--color-top-shelf-400: #989eb1;
--color-top-shelf-500: #7f859b;
--color-top-shelf-600: #6b7183;
--color-top-shelf-700: #565a69;
--color-top-shelf-800: #3e424d;
--color-top-shelf-900: #2b2e36;
--color-top-shelf-950: #181a21;
}SCSS
$top-shelf: #82889c;
$top-shelf-rgb: 130, 136, 156;
$top-shelf-light: mix(#fff, $top-shelf, 20%);
$top-shelf-dark: mix(#000, $top-shelf, 20%);
.element {
color: $top-shelf;
box-shadow: 0 0 0 2px rgba($top-shelf, 0.35);
}