Nearest named color · #B085A2
#B085A2
Nearest named color: Voila!
#B085A2 (rgb(176 133 162), hsl(320 21% 61%), oklch(0.667 0.066 338.8)) is closest to the named color Voila!. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#B085A2
oklch(0.667 0.066 338.8)
Color conversions
- HEX
- #b085a2
- RGB
- rgb(176 133 162)
- HSL
- hsl(320 21% 61%)
- HWB
- hwb(320 52% 31%)
- OKLCH
- oklch(0.667 0.066 338.8)
- OKLab
- oklab(0.667 0.061 -0.024)
- CIE Lab
- lab(60.48 20.54 -8.76)
- LCH
- lch(60.48 22.33 336.9)
- CMYK
- cmyk(0% 24% 8% 31%)
Tints · Shades · Tones
Tints
- B891AB
- C09DB4
- C8A8BD
- D0B5C6
- D8C1D0
- E0CDD9
- E7D9E2
- EFE6EC
- F7F2F5
Shades
- 99738C
- 826177
- 6C5063
- 56404F
- 42303C
- 2E212A
- 1C1319
- 0B060A
- 010101
Tones
- AB859F
- A7849B
- A28498
- 9D8394
- 988391
- 94828E
- 8F828A
- 8A8187
- 858183
Color harmonies
Complementary +180°
- B085A2
Voila!
- 71A186
≈ Quilotoa Green
Analogous -30° +30°
- B085A2
Voila!
- A08AB4
≈ Kismet
- B9848C
≈ Lime Pink
Triadic +120° +240°
- B085A2
Voila!
- 9E9566
≈ Green Lentils
- 649EB0
≈ Dolphin Daze
Split-complementary +150° +210°
- B085A2
Voila!
- 889D71
≈ Sleepy Hollow
- 63A29C
≈ Aqua Rapids
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 3.12:1 · APCA Lc 58
Ag
AAOn black
WCAG 6.72:1 · APCA Lc 44
Best text color: #000000
WCAG 6.72:1 (AA) · APCA Lc 44
Contrast pairs
Code snippets
CSS
:root {
--voila: #b085a2;
--voila-rgb: 176 133 162;
--voila-oklch: oklch(0.667 0.066 338.8);
}
.element {
color: var(--voila);
background-color: hsl(320 21% 61%);
border-color: oklch(0.667 0.066 338.8);
}Tailwind CSS v4
@theme {
--color-voila: #b085a2;
--color-voila-50: #ffeefb;
--color-voila-100: #f8e0ef;
--color-voila-200: #e9cadd;
--color-voila-300: #d0abc2;
--color-voila-400: #b990ac;
--color-voila-500: #a47595;
--color-voila-600: #8a637e;
--color-voila-700: #6f4f65;
--color-voila-800: #513a4b;
--color-voila-900: #392834;
--color-voila-950: #23161f;
}SCSS
$voila: #b085a2;
$voila-rgb: 176, 133, 162;
$voila-light: mix(#fff, $voila, 20%);
$voila-dark: mix(#000, $voila, 20%);
.element {
color: $voila;
box-shadow: 0 0 0 2px rgba($voila, 0.35);
}