Named color · #C5B47F
Aviva
Aviva is #C5B47F: rgb(197 180 127), hsl(45 38% 64%), oklch(0.772 0.073 92.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Aviva color name →
#C5B47F
oklch(0.772 0.073 92.4)
Color conversions
- HEX
- #c5b47f
- RGB
- rgb(197 180 127)
- HSL
- hsl(45 38% 64%)
- HWB
- hwb(45 50% 23%)
- OKLCH
- oklch(0.772 0.073 92.4)
- OKLab
- oklab(0.772 -0.003 0.073)
- CIE Lab
- lab(73.82 0.55 29.41)
- LCH
- lch(73.82 29.42 88.9)
- CMYK
- cmyk(0% 9% 36% 23%)
Tints · Shades · Tones
Tints
- CBBB8C
- D0C399
- D6CAA5
- DCD2B2
- E2D9BF
- E7E1CC
- EDE8D8
- F3F0E5
- F9F7F2
Shades
- AB9C6E
- 92855D
- 796E4C
- 61583C
- 4B442D
- 35301F
- 211D11
- 0E0C06
- 020201
Tones
- BEAF80
- B7AA80
- B0A481
- A99F81
- A29A81
- 9B9581
- 948F81
- 8D8A81
- 878580
Color harmonies
Complementary +180°
- C5B47F
Aviva
- A4B2E4
≈ Myrtle Flower
Analogous -30° +30°
- C5B47F
Aviva
- D7AB85
≈ Sweet Sue
- ACBD89
≈ Shrubbery
Triadic +120° +240°
- C5B47F
Aviva
- 7CC2D0
≈ Twisted Blue
- D1A4C9
≈ Geranium Bud
Split-complementary +150° +210°
- C5B47F
Aviva
- 8CBBE0
≈ Goluboy Blue
- BDAADC
≈ Perfume
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 2.05:1 · APCA Lc 40
Ag
AAAOn black
WCAG 10.20:1 · APCA Lc 62
Best text color: #000000
WCAG 10.20:1 (AAA) · APCA Lc 62
Contrast pairs
Code snippets
CSS
:root {
--aviva: #c5b47f;
--aviva-rgb: 197 180 127;
--aviva-oklch: oklch(0.772 0.073 92.4);
}
.element {
color: var(--aviva);
background-color: hsl(45 38% 64%);
border-color: oklch(0.772 0.073 92.4);
}Tailwind CSS v4
@theme {
--color-aviva: #c5b47f;
--color-aviva-50: #fcf5de;
--color-aviva-100: #efe8cd;
--color-aviva-200: #ded4b2;
--color-aviva-300: #c3b78d;
--color-aviva-400: #ad9e6c;
--color-aviva-500: #97854b;
--color-aviva-600: #807141;
--color-aviva-700: #665a33;
--color-aviva-800: #4c4124;
--color-aviva-900: #352d18;
--color-aviva-950: #201a09;
}SCSS
$aviva: #c5b47f;
$aviva-rgb: 197, 180, 127;
$aviva-light: mix(#fff, $aviva, 20%);
$aviva-dark: mix(#000, $aviva, 20%);
.element {
color: $aviva;
box-shadow: 0 0 0 2px rgba($aviva, 0.35);
}