Nearest named color · #A3BCAE
#A3BCAE
Nearest named color: Copper Patina
#A3BCAE (rgb(163 188 174), hsl(146 16% 69%), oklch(0.772 0.034 161)) is closest to the named color Copper Patina. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#A3BCAE
oklch(0.772 0.034 161)
Color conversions
- HEX
- #a3bcae
- RGB
- rgb(163 188 174)
- HSL
- hsl(146 16% 69%)
- HWB
- hwb(146 64% 26%)
- OKLCH
- oklch(0.772 0.034 161)
- OKLab
- oklab(0.772 -0.032 0.011)
- CIE Lab
- lab(74.04 -10.92 4.09)
- LCH
- lch(74.04 11.66 159.5)
- CMYK
- cmyk(13% 0% 7% 26%)
Tints · Shades · Tones
Tints
- ACC3B6
- B5C9BE
- BED0C6
- C7D6CE
- D0DDD6
- DAE4DE
- E3EBE6
- ECF1EE
- F6F8F7
Shades
- 8DA397
- 788B80
- 63736A
- 4F5D55
- 3C4741
- 2A322E
- 191F1C
- 0A0D0B
- 010201
Tones
- A0B6A9
- 9CB0A5
- 99AAA0
- 95A49B
- 929E97
- 8E9892
- 8B928E
- 878C89
- 848684
Color harmonies
Complementary +180°
- A3BCAE
Copper Patina
- C5ADBB
≈ Desireé
Analogous -30° +30°
- A3BCAE
Copper Patina
- ADBAA4
≈ Winter Squash
- 9DBCBA
≈ Nursery Wall
Triadic +120° +240°
- A3BCAE
Copper Patina
- B1B3CB
≈ Soft Sky
- C9AEA5
≈ Young Turk
Split-complementary +150° +210°
- A3BCAE
Copper Patina
- BCAFC5
≈ Courtly Purple
- C9ADAF
≈ Vista
Tetradic +90° +180° +270°
- A3BCAE
Copper Patina
- A6B7CA
≈ Uniform
- C5ADBB
≈ Desireé
- C3B29E
≈ Canyon View
Contrast & accessibility
Ag
FailOn white
WCAG 2.02:1 · APCA Lc 39
Ag
AAAOn black
WCAG 10.36:1 · APCA Lc 63
Best text color: #000000
WCAG 10.36:1 (AAA) · APCA Lc 63
Contrast pairs
Code snippets
CSS
:root {
--copper-patina: #a3bcae;
--copper-patina-rgb: 163 188 174;
--copper-patina-oklch: oklch(0.772 0.034 161);
}
.element {
color: var(--copper-patina);
background-color: hsl(146 16% 69%);
border-color: oklch(0.772 0.034 161);
}Tailwind CSS v4
@theme {
--color-copper-patina: #a3bcae;
--color-copper-patina-50: #edf8f2;
--color-copper-patina-100: #deece5;
--color-copper-patina-200: #c8d9d0;
--color-copper-patina-300: #a9bdb2;
--color-copper-patina-400: #8ea598;
--color-copper-patina-500: #738d7f;
--color-copper-patina-600: #62786b;
--color-copper-patina-700: #4e6056;
--color-copper-patina-800: #39463e;
--color-copper-patina-900: #27312b;
--color-copper-patina-950: #151d18;
}SCSS
$copper-patina: #a3bcae;
$copper-patina-rgb: 163, 188, 174;
$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);
}