
Figma color wheel
Want to find the perfect complementary or analogous colors to match lilac?
Skip to main content
Everything you need to know about lilac to inspire your next design.
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.

Shades
Tints
Tones
Hues
Complementary
Split
Monochromatic
Analogous
Triadic
Square
Amethyst
Iris Garden
Cotton Candy
Lilac is defined by the following color codes and values to ensure consistency across various digital platforms and devices.
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:
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:
To complement lilac, consider pairing it with:
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:
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.
Contrast 3.44
#A47DAB
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Fail | Fail | |
Pass | Fail | |
Pass | Fail |
Contrast 6.1
#A47DAB
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Pass | Fail | |
Pass | Pass | |
Pass | Pass |
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) |

Want to find the perfect complementary or analogous colors to match lilac?

Discover the soft and delicate color of periwinkle.

Dive into the serene and delicate color of lavender.