Light purple carries the hex code #B19CD9, which resolves to rgb(177, 156, 217) and hsl(261, 45%, 73%). Blue leads red by 40 points and red leads green by 21, which places the hue at 261° in the blue-leaning stretch of purple.
Light purple reaches 2.43:1 against white and 8.63:1 against black, so it fails as light-mode text and clears AAA as a dark-text surface. This page covers every code format, the computed palettes, the four elements where it performs, and how it sorts out from the lavender family it shares a region with.
What Is the Color Light Purple?
Light purple sits at 261° with 45% saturation and 73% lightness. No CSS keyword maps to it, and #B19CD9 is the value most references publish for a mid-pale purple with a blue lean.
The full code set for #B19CD9:
- HEX: #B19CD9
- RGB: rgb(177, 156, 217)
- RGBA: rgba(177, 156, 217, 1)
- HSL: hsl(261, 45%, 73%)
- HSB: 261, 28, 85
- CMYK: 18, 28, 0, 15
The hue at 261° is what gives it a blue rather than a pink character. Violet sits at 300° on the magenta axis, and 39 degrees of separation is the difference between a purple that reads cool and one that reads warm.
Its 45% saturation places it between a pastel and a mid-tone. Lavender at #E6E6FA carries almost no chroma, and light purple carries enough to read as a color rather than as a tinted neutral.
How Does Light Purple Sort Out From Lavender, Thistle, and Mauve?
The pale purple region is the most crowded naming territory in common use, and five words describe overlapping values with no agreed boundaries. Sorting them before a token set gets built saves a lot of later confusion.
Here’s where each lands:
- Light purple (#B19CD9): hue 261, saturation 45%, lightness 73%
- Lavender (#E6E6FA): hue 240, saturation 67%, lightness 94%
- Thistle (#D8BFD8): hue 300, saturation 24%, lightness 80%
- Plum (#DDA0DD): hue 300, saturation 47%, lightness 75%
- Periwinkle (#CCCCFF): hue 240, saturation 100%, lightness 90%
Two clusters emerge from that list. Lavender and periwinkle sit at 240° on the blue axis, while thistle and plum sit at 300° on the magenta axis, and light purple sits between them at 261°.
That middle position is what makes light purple useful. It reads as purple rather than as a pale blue or a pale pink, which neither cluster manages on its own.
Contrast separates them further. Light purple at 2.43:1 is the darkest of the five, with lavender at 1.25:1 the lightest, so they aren’t interchangeable even where the names are used as though they were.
Anyone naming these in a design system should use the hue angle rather than the word. A token called purple-300 with a documented hue removes an ambiguity that five competing names can’t.
How Does Light Purple Appear on Digital Screens?
Light purple renders consistently across panels because no channel sits at an extreme. It shows none of the clipping a saturated violet can produce on narrow-gamut displays.
The measured values set the constraints:
- #B19CD9 on white: 2.43:1, fails AA and the 3:1 non-text floor
- #B19CD9 on black: 8.63:1, passes AAA
- Black text on #B19CD9: 8.63:1, passes AAA
- White text on #B19CD9: 2.43:1, fails
- Dark variant #8575A3 on white: 4.14:1, large text and non-text only
The dark variant nearly rescues it in light mode. #8575A3 at 4.14:1 covers borders, icons, and large headings while still failing body copy by a small margin.
The shade at #6F6288 reaches 5.4:1 and passes AA. That value is what a layout needs when a purple in this family has to be read on white.
Dark mode handles it well. The bright variant #8B6BC7 on the computed surface #120C1D reaches 4.59:1 and passes AA, so one hue family covers both themes with a step in each direction.
What Are the Shades of Light Purple?
Shades come from mixing black into #B19CD9 while holding hue near 261°:
- #9B88BE
- #8575A3
- #6F6288
- #584E6C
- #423A51
- #2C2736
- #16141B
Two steps carry the practical weight. #8575A3 is the first that clears 3:1 for borders and large text, and #6F6288 is the first that passes AA for body copy at 5.4:1.
Tints run toward white through #B8A4DD, #BFADE0, #C6B6E3, #CCBEE7, #D3C7EA, #DAD0ED, #E1D9F0, and #E8E1F4. Those pale steps handle banner fills and selected-row backgrounds, and the upper end approaches lavender territory.
Named neighbors sit across the pale purple region, as covered above:
- Plum (#DDA0DD): magenta axis, lighter, 2.32:1 on white
- Thistle (#D8BFD8): magenta axis, desaturated, 1.85:1
- Lavender (#E6E6FA): blue axis, very pale, 1.25:1
- Medium purple (#9370DB): the same region, deeper, 3.29:1
- Periwinkle (#CCCCFF): blue axis, pale, 1.54:1
What UI Elements Work Best with Light Purple?
Light purple belongs on surfaces that host dark content and on dark themes where its contrast works in its favor. The 8.63:1 for black text on it opens the surface role, and the 2.43:1 against white closes the foreground one.
Body text, links, and functional borders at the base value all fall outside its range. Four element types remain where light purple genuinely performs.
Buttons and CTAs with Dark Labels
Light purple buttons work when the label sits at near-black. At 8.63:1 the text clears AAA, while white on the same fill fails at 2.43:1.
The shade #6F6288 handles white labels instead. White on that value reaches 5.4:1 and passes AA at every size, which is the safer default for a design system standardizing on light labels.
Secondary actions suit the base value better than primary ones. Its moderate saturation reads as supportive rather than assertive.
Status Badges and Category Tags
Badges give light purple a natural home, since they’re small and sit outside the red-yellow-green severity ladder. Plan tiers, feature labels, and topic markers all fit.
A soft variant from the tint ramp reads well. A #E8E1F4 fill with #423A51 text produces a legible badge at high contrast where a solid fill with white text would fail.
Light purple carries no conventional status meaning, which makes it useful for categories and unsuitable for anything read as good or bad.
Backgrounds and Surface Tints
Light purple works as a section background with white cards on top. Its 2.43:1 against white gives slightly more separation than most pastels, which makes the layering more visible.
Its cool, slightly premium register suits creative tools and subscription products. The color reads as considered where a gray canvas reads as default.
Lighter tints suit large areas. #E8E1F4 across a full viewport delivers the same character with less weight than the base.
Dark Mode Accents
Dark mode is where light purple stops fighting the math. The bright variant #8B6BC7 on the computed surface #120C1D reaches 4.59:1 and passes AA, and the base clears AAA at 8.63:1 on pure black.
Lightness should come down slightly on very dark surfaces. The value that reads as gentle on white looks glaring against near-black, and the tint ramp restores the register.
What Are the Best Light Purple Color Palettes for UI?
Every palette below comes from rotating hue around #B19CD9 at fixed saturation and lightness. Because saturation is moderate, these schemes produce muted values rather than the vivid sets a saturated base generates.
Monochromatic
The monochromatic scheme holds hue at 261° and moves lightness: #B19CD9, #613EA2, and #E8E1F4. This is the most useful of the five, since the dark step gives a genuine accent.
#613EA2 reaches 7.5:1 on white and passes AAA. Mapping places it on links and text, the base on fills, and the tint on surfaces.
Analogous
Analogous pulls neighbors 30° in each direction: #B19CD9, #D09CD9, and #9CA5D9. A pale magenta-purple and a periwinkle flanking the base, all at matched lightness.
Cohesive and hierarchy-free. Three values at identical lightness need a dark neutral alongside them or the layout has no anchor.
Complementary
The complement sits opposite at 81°: #B19CD9 paired with #C4D99C, a soft yellow-green. Warm against cool at matched lightness and saturation.
The green reaches 1.7:1 on white, so it belongs on surfaces rather than in text. Adjacent cards work better than foreground and background.
Triadic
The triadic scheme gives you #B19CD9, #D9B19C, and #9CD9B1: light purple, a soft peach, and a pale mint. Muted and evenly spaced, which makes a workable categorical set.
Verification under simulation matters. Matched-lightness triads converge faster under color vision deficiency than saturated sets.
Split-Complementary
Split-complementary softens the pairing: #B19CD9, #D9D09C, and #A5D99C. Light purple with a soft sand and a pale green, and the most flexible of the five for a full interface.
A near-black text color anchors it. Visily’s theme tools can generate the shade ladder beneath each value so the dark partners come out accessible rather than mixed by eye.
Which Colors Are Similar to Light Purple?
Five named colors sit close enough to #B19CD9 to substitute for it:
- Medium purple (#9370DB): the closest in character, deeper, 3.29:1 on white
- Plum (#DDA0DD): magenta axis, lighter, 2.32:1
- Thistle (#D8BFD8): magenta axis, desaturated, 1.85:1
- Lavender (#E6E6FA): blue axis, very pale, 1.25:1
- Periwinkle (#CCCCFF): blue axis, pale and saturated, 1.54:1
Medium purple is the substitution when a layout needs more presence. At 3.29:1 it clears the 3:1 non-text floor and the large-text bar, which the base value misses.
Lavender is the one most often swapped by mistake. At 94% lightness against light purple’s 73%, the two differ by more than any pair of names in this region suggests.
Which Colors Pair Best with Light Purple?
Near-black is light purple’s essential partner. At 8.63:1 it’s the text color that makes every light purple surface work.
Deep purple from the shade ramp supplies the hierarchy. #613EA2 shares the base’s hue, passes AAA on white, and gives the palette a text and link color the base can’t provide.
Warm neutrals prevent the flat register. Cream and warm sand keep light purple reading as considered, while cool grays flatten it toward a washed lavender.
Soft peach from the triadic direction balances it. That pairing reads as warm and approachable, which suits consumer products where a purple alone can feel corporate.
The 60-30-10 split applies as follows:
- 60% neutral: white or off-white surfaces
- 30% light purple and its tints: canvases, banners, and secondary surfaces
- 10% deep purple: links, primary actions, and interactive elements
Which Colors Should You Avoid Pairing with Light Purple?
White fails first. At 2.43:1 a light purple element on white misses the 3:1 non-text floor, so borders built that way read as faint rather than as edges.
Two computed near-clashes cause the next problem: #CB9CD9 and #9CA0D9. Both sit 25° away at identical lightness, offering hue difference with no luminance difference.
Lavender and periwinkle are the practical traps. Any pale purple within about 20 degrees and 15 lightness points produces a boundary the eye can’t resolve.
Mid gray at similar lightness is the subtler failure. A #999999 beside light purple drains its chroma and makes the whole surface read as a rendering artifact.
Does Light Purple Meet Accessibility Standards?
Light purple fails as a foreground on white and passes as a background for dark text. The 2.43:1 measurement falls below the 4.5:1 body-text threshold and the 3:1 non-text floor set by the W3C.
Light purple lands as follows across the common pairings:
- #B19CD9 on white: 2.43:1, fails AA and the 3:1 non-text floor
- White on #B19CD9: 2.43:1, fails
- Black on #B19CD9: 8.63:1, passes AAA
- #6F6288 on white: 5.4:1, passes AA
- #8B6BC7 on #120C1D: 4.59:1, passes AA
The black-on-purple result is what keeps the color usable. Any light purple surface with a dark label is compliant at every size.
Color vision deficiency treats light purple reasonably. Under protanopia and deuteranopia it shifts toward a muted blue-gray rather than merging with reds, so it retains separation in a mixed palette.
Tritanopia is the harder case. Blue-yellow deficiency pulls light purple toward pink, which collapses its distinction from the plum and thistle family and matters most in a category system where several pale purples carry meaning.
How Can You Convert Light Purple Between HEX, RGB, HSL, CMYK, and Other Color Formats?
Each format describes the same pale purple from a different angle:
- HEX #B19CD9: the default in design files and CSS
- RGB rgb(177, 156, 217): blue ahead of red, red ahead of green
- RGBA rgba(177, 156, 217, 1): adds alpha for tinted overlays and selection fills
- HSL hsl(261, 45%, 73%): separates hue from saturation and lightness
- HSB 261, 28, 85: the picker model, reporting saturation very differently
- CMYK 18, 28, 0, 15: magenta over cyan with a small black plate
The channel order carries the diagnosis. Blue above red above green marks a blue-leaning purple, while red above blue above green marks a magenta-leaning one, which is the fastest way to place a purple in the region without opening a picker.
HSL makes the ramp predictable. Holding hue at 261° and saturation at 45% while stepping lightness generates the whole family, including the AA-compliant #6F6288 that the base can never be.
CMYK reproduces it acceptably. The 18, 28, 0, 15 mix sits inside the process gamut, though the purple flattens slightly in print, so a spot color is worth considering for brand-critical work.
Wrapping Up
Light purple sits between the lavender and plum families and needs its hue angle documented rather than its name. #B19CD9 works for surfaces, tags, and buttons with near-black labels at 8.63:1, #8575A3 makes a border perceptible at 4.14:1, #6F6288 carries body copy on white at 5.4:1, and #8B6BC7 handles dark mode at 4.59:1.
Those steps don’t need to be derived one at a time. Open Visily and use its AI-powered design tools to generate the light purple tint and shade ladder, accessible light and dark theme values, and matched accent pairings across the entire design in one pass.
