What color is Lilac?
HEX
#C8A2C8
RGB
200, 162, 200
HSL
300°, 26%, 71%
HSV
300°, 19%, 78%
Lilac sits in the gentle middle of light purples — floral, slightly grayed, and easy on the eyes for large fields. #C8A2C8 suggests garden borders and spring air more than jewels or nightlife. Paired with cream or sage it feels domestic; with charcoal it gains modern crispness.
Best for
Trade show graphics, signage, and booth displays.
Accessibility
Check contrast before using lilac for text-heavy layouts, especially on low-contrast backgrounds.
How does lilac compare to nearby colors?
What is the difference between lilac and wisteria?
Wisteria (#C9A0DC) carries more pigment punch than Lilac (#C8A2C8), so the pair separates by finish as much as hue. Lilac and Wisteria are close enough to substitute for each other, but they do not create the same supporting cast once typography, photography, and neutrals are added. Start with lilac when the palette wants more muted chroma; switch to wisteria when the better fit is working chroma.
What color is lilac?
Named for Syringa blossoms. Common in wedding stationery, spa aesthetics, and skincare lines. Paint and fashion often label similar tones "lilac" or "soft lavender."
What is the hex code for lilac?
| Format | Value |
|---|---|
| HEX | #C8A2C8 |
| RGB | rgb(200, 162, 200) |
| HSL | hsl(300°, 26%, 71%) |
| HSV / HSB | hsv(300°, 19%, 78%) |
| CMYK (approx.) | cmyk(0%, 19%, 0%, 22%) |
Convert Lilac to other color formats
Open the color converter with Lilac (#C8A2C8) prefilled to copy RGB, HSL, HSV, CMYK, or OKLCH values.
Convert Lilac in the color converter →What does lilac mean in design?
Lilac is often associated with freshness, calm affection, and seasonal renewal. Compared with wisteria, lilac can feel a bit rosier; compared with mauve, it is often a touch clearer and less antique.
How do I use lilac in code?
| CSS (hex) | color: #C8A2C8; |
| CSS (rgb) | color: rgb(200, 162, 200); |
| CSS (hsl) | color: hsl(300, 26%, 71%); |
| RGB % | rgb(78%, 64%, 78%) |
| Tailwind | text-[#C8A2C8] |
| SwiftUI | Color(red: 0.784, green: 0.635, blue: 0.784) |
| UIKit | UIColor(red: 0.784, green: 0.635, blue: 0.784, alpha: 1.0) |
| Android | Color.rgb(200, 162, 200) |
| Compose | Color(0xFFC8A2C8) |
| Web Safe | #CC99CC |
Is lilac accessible?
| Combination | Ratio | AA | AA lg | AAA | AAA lg | UI |
|---|---|---|---|---|---|---|
| AaWhite text on this color | 2.22:1 | ✗ | ✗ | ✗ | ✗ | ✗ |
| AaBlack text on this color | 9.46:1 | ✓ | ✓ | ✓ | ✓ | ✓ |
| AaThis color as text on white | 2.22:1 | ✗ | ✗ | ✗ | ✗ | ✗ |
| AaThis color as text on black | 9.46:1 | ✓ | ✓ | ✓ | ✓ | ✓ |
WCAG 2.1: AA normal ≥ 4.5:1, AA large text ≥ 3:1, AAA normal ≥ 7:1, AAA large ≥ 4.5:1, UI components ≥ 3:1.
How does lilac look with color blindness?
Simulated appearance for common types of color vision deficiency. Actual perception varies by individual.
What colors go with lilac
With lilac on broader surfaces, charcoal adds enough depth to keep the system legible without the harsher edge of pure black.
Navy blue reins in lilac without deadening it, which is useful when you want warmth to stay present but not dominate every part of the page.
White makes lilac feel clearer and more breathable without pulling it warmer or cooler than it already is.
What colors clash with lilac
Magenta remaps lilac too aggressively, dragging it away from bridal, stationery, and dreamy interface work and into a brighter, more performative palette.
Cyan redirects lilac toward a more technical, backlit interpretation, which is risky when the goal is warmth, polish, or print-minded editorial work.
How should I use lilac in design?
- •Use lilac for buttons, badges, and chart accents where it can stand out. Test text contrast with WCAG tools before using it for body copy on light backgrounds.
- •Pair lilac with cool accents (navy, sage, steel blue) for sharp contrast, or keep it with other warm tones (cream, gold, tan) for a cohesive, editorial feel.
- •Lilac works in beauty, creative-agency, and premium-product contexts where the brand wants to feel distinctive without resorting to standard corporate blue.
What are good lilac palettes?
Design with lilac in Moda
Create a presentation or document using lilac as your accent color. Moda's AI applies your color palette automatically.
Create a design with lilac →What are the shades and tints of lilac?
Shades (darker)
Tints (lighter)
Tones (desaturated)
Hue variations
What are the color harmonies for lilac?
Harmonies are calculated from the base swatch. When a harmony matches a named color page, it links there; otherwise it appears here as a computed reference swatch.
Similar colors
Wisteria
Wisteria keeps roughly the same visual weight as lilac but changes the undertone story, which is often enough to move a palette from warmer and tactile to cooler and more technical, or the reverse.
Orchid
Orchid is almost the same hue as lilac; the real difference is value, with orchid feeling more grounded and anchor-ready.
Amethyst
Amethyst keeps roughly the same visual weight as lilac but changes the undertone story, which is often enough to move a palette from warmer and tactile to cooler and more technical, or the reverse.
Mauve
Mauve is close enough to lilac to keep the palette cohesive, yet the lighter-darker shift still decides whether the family behaves more like atmosphere or more like structure.
Hot Pink
Hot Pink occupies a similar depth to lilac, though it pushes the family toward a more warm reading and a different material feel.
Frequently asked questions
What is the hex code for lilac?
The hex code for lilac is #C8A2C8. In RGB, that's 200 red, 162 green, and 200 blue. The approximate CMYK equivalent is 0% cyan, 19% magenta, 0% yellow, and 22% key (black).
Is lilac a warm or cool color?
Lilac sits near the warm-cool boundary but tips warm, which makes the surrounding neutrals especially important in deciding how the palette finally reads.
Is lilac suitable for broader surfaces and long-form layouts?
Lilac can hold broader surfaces comfortably because it does not demand attention on every glance. It is a better candidate for full-theme use than a brighter or more electric neighbor would be.
How should I use lilac in a design?
Lilac works as a soft background or supporting color for slide canvases, section panels, and marketing surfaces. Use dark text for readability and reserve stronger accents for buttons, charts, and key takeaways.
Can I use lilac for text or backgrounds?
Lilac works better with dark text than white text. Black text reaches 9.46:1 contrast on the swatch, which makes the color more usable as a background or highlight surface than as a dark panel.
More purple colors
Keep exploring color resources
All color pages
Browse the full library of color references, pairings, and palettes.
Purple colors
Compare lilac with other purple tones.
Blue colors
Explore nearby color families to build stronger palettes and contrasts.
Neutral colors
Explore nearby color families to build stronger palettes and contrasts.
Pink colors
Explore nearby color families to build stronger palettes and contrasts.
Last updated April 6, 2026
Color values are computed from the listed hex code using standard conversion formulas. RGB, HSL, and HSV are exact screen-ready conversions. CMYK is an approximate on-screen reference, not a press-ready print specification. Pairings, palettes, and use-case guidance are heuristic recommendations derived from color relationships, contrast behavior, and common presentation, document, and UI patterns.