Liliac #C48EFD

Liliac is a medium-light, vivid purple with hex code #C48EFD and RGB rgb(196, 142, 253).

Aa

Black text reads best on this color (8.63:1).

About this color

#C48EFD is a medium-light, vivid purple. In OKLCH its lightness is 74%, its chroma 0.163 and its hue 305°. Its hue sits between the warm and cool halves of the wheel. It is the named color Liliac. Black text reads best on it, at 8.63:1.

Hue familyPurples
Lightnessmedium-light (74%)
Chromavivid (0.163)
Temperaturein between
Nearest nameLiliac
Black text8.63:1
White text2.43:1

Colors that go with Liliac

Matches found by rotating Liliac around the OKLCH hue wheel, each labelled with the closest name in our list.

Color palettes with Liliac

Curated color palettes that contain a color within ΔE 0.06 (OKLab) of Liliac, closest first.

Similar named colors

The eight named colors closest to Liliac, with their ΔE distance.

More about Liliac

How to make Liliac

A starting recipe from common paint colors, found with a spectral paint model (the color mixer’s paint mode). Real pigments vary, so mix a small test batch and adjust.

  • 4 parts white
  • 3 parts purple
  • 1 part pink

Recipe result: #C78BD9, a difference of ΔE 0.052 from Liliac. That is close; add a little more of one paint to match.

What colors make purple? | Color mixing chart

Codes for Liliac in every format

HEX#C48EFD
RGBrgb(196, 142, 253)
HSLhsl(269, 97%, 77%)
OKLCHoklch(74.2% 0.163 305.2)

Contrast

WCAG 2 contrast ratios are the conformance target: AA needs 4.5:1 for body text and 3:1 for large text, AAA needs 7:1. APCA Lc values are supplementary guidance from the WCAG 3 drafts.

PairWCAG 2ResultAPCAAPCA guidance
White text on #C48EFD 2.43:1 Fails Lc -52.7 Large or bold text, headings
Black text on #C48EFD 8.63:1 AAA Lc 56.3 Large or bold text, headings
#C48EFD text on white 2.43:1 Fails Lc 47.7 Large or bold text, headings
#C48EFD text on black 8.63:1 AAA Lc -54.3 Large or bold text, headings

Shades and tints of Liliac

A 50–950 scale built in OKLCH: the hue is held, lightness follows a Tailwind v4-like curve, and every step is kept inside the sRGB gamut. This color sits at step 400.

  1. Step 50

    50

    #F7F3FD

    oklch(97% 0.014 304.1)

  2. Step 100

    100

    #EEE5FA

    oklch(93.5% 0.03 305.1)

  3. Step 200

    200

    #E2D0F8

    oklch(88.5% 0.057 305.6)

  4. Step 300

    300

    #D0B0F6

    oklch(80.9% 0.102 305.1)

  5. Step 400

    400 (this color)

    #C48EFD

    oklch(74.2% 0.163 305.2)

  6. Step 500

    500

    #A85EEC

    oklch(63.1% 0.209 305.2)

  7. Step 600

    600

    #943EDA

    oklch(55.7% 0.226 305.3)

  8. Step 700

    700

    #7E2DBD

    oklch(49.1% 0.211 305.3)

  9. Step 800

    800

    #662899

    oklch(42.7% 0.175 305)

  10. Step 900

    900

    #53277A

    oklch(37.7% 0.137 305.1)

  11. Step 950

    950

    #311847

    oklch(27% 0.086 306)

Export this scale for Tailwind in the Tailwind colors tool

Liliac with color blindness

Simulated with the Machado et al. (2009) model. ΔE is how far the color moves: below about 0.02 you would not notice a change.

VisionSeen asShift (ΔE)
Protanopia (no red cones)#72A4FF0.117
Deuteranopia (no green cones)#7FA6FA0.107
Tritanopia (no blue cones)#BBA0BA0.120
Achromatopsia (no color)#A6A6A60.164

Use Liliac in your product

Turn it into light and dark UI roles checked for contrast, then export to Tailwind v4, shadcn/ui, CSS or design tokens.