Nearest named color · #A0CAE2
#A0CAE2
Nearest named color: Vive le Vent
#A0CAE2 (rgb(160 202 226), hsl(202 53% 76%), oklch(0.817 0.056 233.4)) is closest to the named color Vive le Vent. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#A0CAE2
oklch(0.817 0.056 233.4)
Color conversions
- HEX
- #a0cae2
- RGB
- rgb(160 202 226)
- HSL
- hsl(202 53% 76%)
- HWB
- hwb(202 63% 11%)
- OKLCH
- oklch(0.817 0.056 233.4)
- OKLab
- oklab(0.817 -0.033 -0.045)
- CIE Lab
- lab(78.91 -10.21 -16.74)
- LCH
- lch(78.91 19.61 238.6)
- CMYK
- cmyk(29% 11% 0% 11%)
Tints · Shades · Tones
Tints
- AACFE5
- B3D5E8
- BDDAEB
- C6DFEE
- D0E4F1
- D9EAF4
- E2EFF6
- ECF4F9
- F5FAFC
Shades
- 8BAFC4
- 7695A8
- 617C8C
- 4E6471
- 3B4D57
- 29373E
- 192227
- 090F12
- 010203
Tones
- 9DC2D8
- 9ABBCE
- 97B3C4
- 94ACBA
- 91A4B0
- 8D9DA6
- 8A969D
- 878E93
- 838789
Color harmonies
Complementary +180°
- A0CAE2
Vive le Vent
- E1BAA2
≈ Warming Peach
Analogous -30° +30°
- A0CAE2
Vive le Vent
- 99CED3
≈ Peppermint Twist
- B1C4E8
≈ Promise Keeping
Triadic +120° +240°
- A0CAE2
Vive le Vent
- E1B5C6
≈ Mental Floss
- C3C89E
≈ Watercress Pesto
Split-complementary +150° +210°
- A0CAE2
Vive le Vent
- E5B6B2
≈ Pink Dust
- D5C19A
≈ Dakota Trail
Tetradic +90° +180° +270°
- A0CAE2
Vive le Vent
- D6B8D8
≈ Lilac Haze
- E1BAA2
≈ Warming Peach
- AECDAC
≈ Spinach Dip
Contrast & accessibility
Ag
FailOn white
WCAG 1.74:1 · APCA Lc 32
Ag
AAAOn black
WCAG 12.04:1 · APCA Lc 71
Best text color: #000000
WCAG 12.04:1 (AAA) · APCA Lc 71
Contrast pairs
Code snippets
CSS
:root {
--vive-le-vent: #a0cae2;
--vive-le-vent-rgb: 160 202 226;
--vive-le-vent-oklch: oklch(0.817 0.056 233.4);
}
.element {
color: var(--vive-le-vent);
background-color: hsl(202 53% 76%);
border-color: oklch(0.817 0.056 233.4);
}Tailwind CSS v4
@theme {
--color-vive-le-vent: #a0cae2;
--color-vive-le-vent-50: #e7f8ff;
--color-vive-le-vent-100: #d7ebf8;
--color-vive-le-vent-200: #bed9e9;
--color-vive-le-vent-300: #9dbdd0;
--color-vive-le-vent-400: #7ea5bb;
--color-vive-le-vent-500: #608da6;
--color-vive-le-vent-600: #52778c;
--color-vive-le-vent-700: #415f70;
--color-vive-le-vent-800: #2e4652;
--color-vive-le-vent-900: #1f3039;
--color-vive-le-vent-950: #0f1d24;
}SCSS
$vive-le-vent: #a0cae2;
$vive-le-vent-rgb: 160, 202, 226;
$vive-le-vent-light: mix(#fff, $vive-le-vent, 20%);
$vive-le-vent-dark: mix(#000, $vive-le-vent, 20%);
.element {
color: $vive-le-vent;
box-shadow: 0 0 0 2px rgba($vive-le-vent, 0.35);
}