Nearest named color · #9AB6A5
#9AB6A5
Nearest named color: Copper Patina
#9AB6A5 (rgb(154 182 165), hsl(144 16% 66%), oklch(0.75 0.039 158.7)) is closest to the named color Copper Patina. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#9AB6A5
oklch(0.75 0.039 158.7)
Color conversions
- HEX
- #9ab6a5
- RGB
- rgb(154 182 165)
- HSL
- hsl(144 16% 66%)
- HWB
- hwb(144 60% 29%)
- OKLCH
- oklch(0.75 0.039 158.7)
- OKLab
- oklab(0.75 -0.036 0.014)
- CIE Lab
- lab(71.56 -12.48 5.32)
- LCH
- lch(71.56 13.57 156.9)
- CMYK
- cmyk(15% 0% 9% 29%)
Tints · Shades · Tones
Tints
- A4BDAE
- AEC4B6
- B8CCBF
- C2D3C8
- CCDAD1
- D6E1DA
- E0E9E3
- EAF0EC
- F5F8F6
Shades
- 859E8F
- 718679
- 5E6F65
- 4B5951
- 39443D
- 27302B
- 171D1A
- 090C0A
- 010201
Tones
- 97B0A1
- 95AB9D
- 92A69A
- 90A096
- 8D9B92
- 8B958F
- 88908B
- 858B87
- 838584
Color harmonies
Complementary +180°
- 9AB6A5
Copper Patina
- BFA5B6
≈ Pansy Posie
Analogous -30° +30°
- 9AB6A5
Copper Patina
- A6B399
≈ Banksia
- 93B6B3
≈ Baroque Blue
Triadic +120° +240°
- 9AB6A5
Copper Patina
- A8ACC7
≈ Cosmic Sky
- C5A69C
≈ Patchwork Pink
Split-complementary +150° +210°
- 9AB6A5
Copper Patina
- B5A8C1
≈ Transparent Mauve
- C5A4A9
≈ Pale Mauve
Tetradic +90° +180° +270°
- 9AB6A5
Copper Patina
- 9BB1C6
≈ Perfect Landing
- BFA5B6
≈ Pansy Posie
- BFAA94
≈ Camel Hide
Contrast & accessibility
Ag
FailOn white
WCAG 2.18:1 · APCA Lc 43
Ag
AAAOn black
WCAG 9.60:1 · APCA Lc 59
Best text color: #000000
WCAG 9.60:1 (AAA) · APCA Lc 59
Contrast pairs
Code snippets
CSS
:root {
--copper-patina: #9ab6a5;
--copper-patina-rgb: 154 182 165;
--copper-patina-oklch: oklch(0.75 0.039 158.7);
}
.element {
color: var(--copper-patina);
background-color: hsl(144 16% 66%);
border-color: oklch(0.75 0.039 158.7);
}Tailwind CSS v4
@theme {
--color-copper-patina: #9ab6a5;
--color-copper-patina-50: #ecf9f1;
--color-copper-patina-100: #ddece4;
--color-copper-patina-200: #c7dacf;
--color-copper-patina-300: #a7beb1;
--color-copper-patina-400: #8ca696;
--color-copper-patina-500: #718e7d;
--color-copper-patina-600: #60786a;
--color-copper-patina-700: #4c6054;
--color-copper-patina-800: #38473d;
--color-copper-patina-900: #26312a;
--color-copper-patina-950: #141d17;
}SCSS
$copper-patina: #9ab6a5;
$copper-patina-rgb: 154, 182, 165;
$copper-patina-light: mix(#fff, $copper-patina, 20%);
$copper-patina-dark: mix(#000, $copper-patina, 20%);
.element {
color: $copper-patina;
box-shadow: 0 0 0 2px rgba($copper-patina, 0.35);
}