Lilac is a soothing and elegant shade of violet that evokes fondness, serenity, and sophistication. This soft, muted color falls between blue and red on the color wheel, with slightly more blue for a subtle cool undertone.
Lilac is defined by the following color codes and values to ensure consistency across various digital platforms and devices.
- HEX code: #A47DAB
- RGB value: 64.3% red, 49% green, and 67.1% blue
Accessibility considerations play a crucial role in UX and UI design color choices. Figma offers plugins in the Community to make sure your designs meet Web Content Accessibility Guidelines.
Here are some ways to use lilac in your designs:
- Convey elegance. Lilac has a sophisticated air that’s perfect for high-end branding, such as wedding planners and fashion designers.
- Invoke springtime. Soft floral colors like lilac bring to mind visions of spring. Use lilac in a pastel palette with pale pinks, purples, and greens to express renewal, growth, and warmth.
- Inspire tranquility. Lilac is a calming color that inspires peace and relaxation. As a background color, lilac is a great choice to make users feel at ease on your website or platform.
Keep in mind that color and its meaning can change from culture to culture—and at any given time. If you are designing for a global audience, research color considerations for your specific regions.
For variations within the same muted spectrum as lilac, consider:
- Lavender (#D3D3FF) soothes the senses as a lighter, softer shade of violet.
- Mauve (#E0AFFF) is more vibrant and saturated with an energizing charm.
- Puce (#E491A6) adds a touch of romance to any palette with its soft pink hue.
- Periwinkle (#CCCCFF) radiates a gentle elegance in a soft bluish purple.
To complement lilac, consider pairing it with:
- Green sage (#98A869) harmonizes with lilac’s muted shade.
- Blue-gray (#6A89A7) lends more sophistication to lilac for a refined palette.
- Tiffany Blue® (#81D8D0) offers a light and airy contrast to lilac’s subdued hue.
- Dusty rose (#DCA1A1) elevates lilac to create a gentle floral theme.
Other colors worth considering include soft and airy cream to make lilac stand out, sophisticated dark gray or slate to create a mature palette, and elegant jewel tones to elevate lilac’s soft tone.
While lilac is muted, it may clash with:
- Yellow (#FFFF00) outshines lilac’s understated hue.
- Neon green (#2CFF05) overwhelms the softness of lilac and creates a jarring contrast.
- Tangerine (#FFA800) commands attention and creates an imbalanced contrast with lilac.
- Scarlet (#ED2100) overpowers lilac with a bold, fiery vibrance that smothers lilac’s serenity.
- Royal blue (#305CDE) is too vibrant and saturated for lilac’s gentle shade.
Named after the lilac flower, the color lilac evokes visions of spring and renewal. Lilac also conveys pleasant, soft emotions, especially those associated with love and innocence. Both the color and flower evoke feelings of hope and new possibilities.
The calming properties of lilac stem from its soft blend of purple and blue. This cool combination creates a blissful atmosphere. Lilac is a gentle color that inspires serenity, trust, and optimism.
Today, designers use lilac to create a calm, refined palette with a touch of romance. As a background color, lilac creates a relaxing user experience, It may be a less popular color than lavender, but lilac has a gentle, pleasant charm that can make your design soothing and approachable.
Before lilac was known as a color, the word solely referred to the flower of the same name until 1766, when a Swedish naturalist dubbed a species of bird in Sub-Saharan Africa the lilac-breasted roller. This was the first time lilac was used to refer to anything beyond the plant, but the color lilac, used to describe the color of lilac flowers, was first documented in England in 1775.
During the Victorian era, this pale violet color was common among women in mourning when they were no longer expected to wear black. During this time, lilac and lavender may have been used interchangeably, though we now recognize them as distinct colors. Where lilac has more blue undertones and tends to be darker in shade, lavender has a higher percentage of blue and is usually lighter in color.
The 1920s saw a revitalization of lilac, introducing the color into cosmetics. Later in the century, lilac became popular in interior design, complementing other pastels.
Color variations
Shades
Tints
Tones
Hues
Color harmonies
Complementary
Split
Monochromatic
Analogous
Triadic
Square
Custom palettes
Amethyst
Iris Garden
Cotton Candy
Contrast checker
Contrast 3.44
- Large Text
#A47DAB
- Normal Text
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Fail | Fail | |
Pass | Fail | |
Pass | Fail |
Contrast 6.1
- Large Text
#A47DAB
- Normal Text
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Pass | Fail | |
Pass | Pass | |
Pass | Pass |
Color simulations
Protanopia
Deuteranopia
Tritanopia
Achromatopsia
The hexadecimal color #A47DAB, known as lilac, has RGB values of R:164 G:125, B:171 and CMYK values of C:4, M:27, Y:0, K:33.
| VALUE | CSS | |
|---|---|---|
| HEX | #A47DAB | #A47DAB |
| RGB DECIMAL | 164, 125, 171 | RGB(164, 125, 171) |
| RGB PERCENTAGE | 64.3, 49, 67.1 | RGB(64.3%, 49%, 67.1%) |
| CMYK | 4, 27, 0, 33 | |
| HSL | 290.9°, 21.5, 58 | HSL(290.9°, 21.5%, 58%) |
| HSV (OR HSB) | 290.9°, 26.9, 67.1 | |
| WEB SAFE | #996699 | #996699 |
| CIE-LAB | 57.56, 23.338, -18.608 | |
| XYZ | 29.993, 25.501, 41.868 | |
| xyY | 0.308, 0.262, 25.501 | |
| CIE-LCH | 57.56, 29.848, 321.433 | |
| CIE-LUV | 57.56, 18.792, -31.301 | |
| HUNTER-LAB | 50.498, 17.647, -13.809 | |
| BINARY | 10100100, 01111101, 10101011 | |
| iOS - SwiftUI | Color(red: 0.643, green: 0.49, blue: 0.671) | |
| iOS - UIKit | UIColor(red: 0.643, green: 0.49, blue: 0.671, alpha: 1) | |
| Android - Compose | Color(0xFFA47DAB) |
