Nearest named color · #CAB768
#CAB768
Nearest named color: The Weight of Gold
#CAB768 (rgb(202 183 104), hsl(48 48% 60%), oklch(0.779 0.102 96.2)) is closest to the named color The Weight of Gold. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#CAB768
oklch(0.779 0.102 96.2)
Color conversions
- HEX
- #cab768
- RGB
- rgb(202 183 104)
- HSL
- hsl(48 48% 60%)
- HWB
- hwb(48 41% 21%)
- OKLCH
- oklch(0.779 0.102 96.2)
- OKLab
- oklab(0.779 -0.011 0.101)
- CIE Lab
- lab(74.78 -0.68 42.45)
- LCH
- lch(74.78 42.46 90.9)
- CMYK
- cmyk(0% 9% 49% 21%)
Tints · Shades · Tones
Tints
- CFBE78
- D4C588
- DACD97
- DFD4A6
- E4DBB5
- E9E2C4
- EFE9D3
- F4F1E1
- FAF8F0
Shades
- AF9F59
- 95874B
- 7C703E
- 645A30
- 4D4524
- 373118
- 221E0C
- 0F0C04
- 020200
Tones
- C2B16C
- BBAC6F
- B3A772
- ACA175
- A49C78
- 9D967A
- 95917C
- 8E8B7D
- 87867F
Color harmonies
Complementary +180°
- CAB768
The Weight of Gold
- A5B1F8
≈ Wondrous Wisteria
Analogous -30° +30°
- CAB768
The Weight of Gold
- E4AA6E
≈ Ninjin Orange
- A6C37A
≈ Opaline Green
Triadic +120° +240°
- CAB768
The Weight of Gold
- 60C7E1
≈ Squeaky
- E19ED0
≈ Exotic Violet
Split-complementary +150° +210°
- CAB768
The Weight of Gold
- 7FBDF5
≈ Electric Eel
- C7A6EB
≈ Tropical Violet
Tetradic +90° +180° +270°
- CAB768
The Weight of Gold
- 5FCCC1
≈ Kinetic Teal
- A5B1F8
≈ Wondrous Wisteria
- EF9BAD
≈ Pink Moment
Contrast & accessibility
Ag
FailOn white
WCAG 2.00:1 · APCA Lc 39
Ag
AAAOn black
WCAG 10.48:1 · APCA Lc 64
Best text color: #000000
WCAG 10.48:1 (AAA) · APCA Lc 64
Contrast pairs
Code snippets
CSS
:root {
--the-weight-of-gold: #cab768;
--the-weight-of-gold-rgb: 202 183 104;
--the-weight-of-gold-oklch: oklch(0.779 0.102 96.2);
}
.element {
color: var(--the-weight-of-gold);
background-color: hsl(48 48% 60%);
border-color: oklch(0.779 0.102 96.2);
}Tailwind CSS v4
@theme {
--color-the-weight-of-gold: #cab768;
--color-the-weight-of-gold-50: #fcf6d5;
--color-the-weight-of-gold-100: #f0e9c2;
--color-the-weight-of-gold-200: #dfd5a3;
--color-the-weight-of-gold-300: #c5b87b;
--color-the-weight-of-gold-400: #b09e54;
--color-the-weight-of-gold-500: #9a8528;
--color-the-weight-of-gold-600: #827124;
--color-the-weight-of-gold-700: #685a1d;
--color-the-weight-of-gold-800: #4e4212;
--color-the-weight-of-gold-900: #362d0b;
--color-the-weight-of-gold-950: #211a01;
}SCSS
$the-weight-of-gold: #cab768;
$the-weight-of-gold-rgb: 202, 183, 104;
$the-weight-of-gold-light: mix(#fff, $the-weight-of-gold, 20%);
$the-weight-of-gold-dark: mix(#000, $the-weight-of-gold, 20%);
.element {
color: $the-weight-of-gold;
box-shadow: 0 0 0 2px rgba($the-weight-of-gold, 0.35);
}