Nearest named color · #776AB4
#776AB4
Nearest named color: Venus Violet
#776AB4 (rgb(119 106 180), hsl(251 33% 56%), oklch(0.568 0.112 290.4)) is closest to the named color Venus Violet. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#776AB4
oklch(0.568 0.112 290.4)
Color conversions
- HEX
- #776ab4
- RGB
- rgb(119 106 180)
- HSL
- hsl(251 33% 56%)
- HWB
- hwb(251 42% 29%)
- OKLCH
- oklch(0.568 0.112 290.4)
- OKLab
- oklab(0.568 0.039 -0.105)
- CIE Lab
- lab(48.52 18.5 -37.96)
- LCH
- lch(48.52 42.23 296)
- CMYK
- cmyk(34% 41% 0% 29%)
Tints · Shades · Tones
Tints
- 8379BC
- 9087C4
- 9D96CC
- AAA4D3
- B8B3DB
- C6C2E2
- D4D1EA
- E2E0F1
- F0F0F8
Shades
- 675B9C
- 574D85
- 473F6E
- 383158
- 2A2444
- 1C1830
- 100D1D
- 05040C
- 010002
Tones
- 786DAF
- 786FAA
- 7972A5
- 7A74A0
- 7B769B
- 7C7896
- 7D7A91
- 7E7C8B
- 7F7E86
Color harmonies
Complementary +180°
- 776AB4
Venus Violet
- 7B7C1E
≈ Tool Green
Analogous -30° +30°
- 776AB4
Venus Violet
- 4F76B9
≈ Diva Violet
- 94609F
≈ Empire Violet
Triadic +120° +240°
- 776AB4
Venus Violet
- AB6134
≈ Corn Snake
- 008C6D
≈ Festive Green
Split-complementary +150° +210°
- 776AB4
Venus Violet
- 996E11
≈ Chamois Yellow
- 508745
≈ Beanpole
Tetradic +90° +180° +270°
- 776AB4
Venus Violet
- AF595A
≈ Italian Villa
- 7B7C1E
≈ Tool Green
- 00888E
≈ Ocean Soul
Contrast & accessibility
Ag
AAOn white
WCAG 4.66:1 · APCA Lc 72
Ag
AAOn black
WCAG 4.50:1 · APCA Lc 29
Best text color: #FFFFFF
WCAG 4.66:1 (AA) · APCA Lc 72
Contrast pairs
Code snippets
CSS
:root {
--venus-violet: #776ab4;
--venus-violet-rgb: 119 106 180;
--venus-violet-oklch: oklch(0.568 0.112 290.4);
}
.element {
color: var(--venus-violet);
background-color: hsl(251 33% 56%);
border-color: oklch(0.568 0.112 290.4);
}Tailwind CSS v4
@theme {
--color-venus-violet: #776ab4;
--color-venus-violet-50: #f5f0ff;
--color-venus-violet-100: #e8e2ff;
--color-venus-violet-200: #d5ccff;
--color-venus-violet-300: #b9adec;
--color-venus-violet-400: #9e93dc;
--color-venus-violet-500: #8678cb;
--color-venus-violet-600: #7265ab;
--color-venus-violet-700: #5b5189;
--color-venus-violet-800: #413b67;
--color-venus-violet-900: #2d2948;
--color-venus-violet-950: #1a162f;
}SCSS
$venus-violet: #776ab4;
$venus-violet-rgb: 119, 106, 180;
$venus-violet-light: mix(#fff, $venus-violet, 20%);
$venus-violet-dark: mix(#000, $venus-violet, 20%);
.element {
color: $venus-violet;
box-shadow: 0 0 0 2px rgba($venus-violet, 0.35);
}