Named color · #804B81
Vibrant Orchid
Vibrant Orchid is #804B81: rgb(128 75 129), hsl(299 26% 40%), oklch(0.495 0.104 326.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Purple mean? → · Vibrant Orchid color name →
#804B81
oklch(0.495 0.104 326.4)
Color conversions
- HEX
- #804b81
- RGB
- rgb(128 75 129)
- HSL
- hsl(299 26% 40%)
- HWB
- hwb(299 29% 49%)
- OKLCH
- oklch(0.495 0.104 326.4)
- OKLab
- oklab(0.495 0.087 -0.058)
- CIE Lab
- lab(39.88 29.62 -20.99)
- LCH
- lch(39.88 36.3 324.7)
- CMYK
- cmyk(1% 42% 0% 49%)
Tints · Shades · Tones
Tints
- 8D5C8D
- 996D9A
- A67FA6
- B390B2
- BFA2BF
- CCB4CC
- D9C7D8
- E5D9E5
- F2ECF2
Shades
- 6E406F
- 5D355E
- 4D2B4E
- 3D213E
- 2E172E
- 1F0E1F
- 120612
- 060206
- 010001
Tones
- 805181
- 815681
- 815C81
- 816181
- 816681
- 816C81
- 817181
- 817681
- 807B80
Color harmonies
Complementary +180°
- 804B81
Vibrant Orchid
- 35713C
≈ Mount Hyjal
Analogous -30° +30°
- 804B81
Vibrant Orchid
- 685496
≈ Rollick
- 8F4663
≈ Putnam Plum
Triadic +120° +240°
- 804B81
Vibrant Orchid
- 7B5D00
≈ Hè Sè Brown
- 006F7A
≈ Carnival Night
Split-complementary +150° +210°
- 804B81
Vibrant Orchid
- 5F6915
≈ Mud Green
- 007260
≈ Falcon Turquoise
Tetradic +90° +180° +270°
- 804B81
Vibrant Orchid
- 8E501D
≈ Plane Brown
- 35713C
≈ Mount Hyjal
- 096A95
≈ Hydra
Contrast & accessibility
Ag
AAOn white
WCAG 6.47:1 · APCA Lc 82
Ag
FailOn black
WCAG 3.24:1 · APCA Lc 20
Best text color: #FFFFFF
WCAG 6.47:1 (AA) · APCA Lc 82
Contrast pairs
Code snippets
CSS
:root {
--vibrant-orchid: #804b81;
--vibrant-orchid-rgb: 128 75 129;
--vibrant-orchid-oklch: oklch(0.495 0.104 326.4);
}
.element {
color: var(--vibrant-orchid);
background-color: hsl(299 26% 40%);
border-color: oklch(0.495 0.104 326.4);
}Tailwind CSS v4
@theme {
--color-vibrant-orchid: #804b81;
--color-vibrant-orchid-50: #ffebff;
--color-vibrant-orchid-100: #fcdcfa;
--color-vibrant-orchid-200: #eec5eb;
--color-vibrant-orchid-300: #d5a5d2;
--color-vibrant-orchid-400: #bf89bf;
--color-vibrant-orchid-500: #aa6cab;
--color-vibrant-orchid-600: #8f5c90;
--color-vibrant-orchid-700: #734974;
--color-vibrant-orchid-800: #543557;
--color-vibrant-orchid-900: #3b243c;
--color-vibrant-orchid-950: #251326;
}SCSS
$vibrant-orchid: #804b81;
$vibrant-orchid-rgb: 128, 75, 129;
$vibrant-orchid-light: mix(#fff, $vibrant-orchid, 20%);
$vibrant-orchid-dark: mix(#000, $vibrant-orchid, 20%);
.element {
color: $vibrant-orchid;
box-shadow: 0 0 0 2px rgba($vibrant-orchid, 0.35);
}