#EDE5FF

Accessibility

AAA

17.25:1

Vs white / black

1.22:1 · 17.25:1

Sources

Library color

Codes

Formats

HEX

#ede5ff

RGB

rgb(237, 229, 255)

RGBA

rgba(237, 229, 255, 1)

HSL

hsl(258, 100%, 95%)

HSLA

hsla(258, 100%, 95%, 1)

HSV

hsv(258, 10%, 100%)

LAB

lab(92.25% 7.44 -11.59)

LCH

lch(92.25% 13.77 302.7)

OKLAB

oklab(0.936 0.0178 -0.0311)

OKLCH

oklch(0.936 0.0358 299.78)

XYZ

xyz(80.99, 81.26, 106.01)

CMYK

cmyk(7%, 10%, 0%, 0%)

CSS

color: #ede5ff;

CSS variable

--color-ede5ff: #ede5ff;

SCSS

$color-ede5ff: #ede5ff;

JavaScript

const color = "#ede5ff";

TypeScript

const color: string = "#ede5ff";

React

style={{ backgroundColor: "#ede5ff" }}

JSON

{ "hex": "#ede5ff", "rgb": { "r": 237, "g": 229, "b": 255 }, "oklch": "oklch(0.936 0.0358 299.78)" }

Export

Developer code

css

:root {
  --#ede5ff-1: #ede5ff;
}

Design systems

Nearest official tokens

An arbitrary HEX is not an official Tailwind, Material, or Bootstrap color. Distance is CIEDE2000.

Nearest Tailwind color

purple-100

Similar · ΔE 1.68 · #F3E8FF

Nearest CSS named color

Lavender

Noticeably different · ΔE 4.1 · #E6E6FA

Nearest Material color

deep-purple-50

Noticeably different · ΔE 4.14 · #EDE7F6

Nearest Bootstrap color

light

Very different · ΔE 12.09 · #F8F9FA

OKLCH

Perceptual 50–950 scale

Generated in OKLCH from this hex. Not an official Tailwind scale unless the hex itself is a Tailwind token.

50f7f2ff 100eae5f6 200d7d1e4 300c0bad0 400a49db5 500898299 600736c80 7005c5667 80045414f 900302d38 9501c1923

Palette

Tints & shades

Full scale from light tints through the base color into deep shades

fefdff fcfbff fbf9ff f9f6ff f8f4ff f6f2ff f4f0ff f3eeff f2ecff f0e9ff efe7ff ede5ff d9d2ea c6bfd5 b2acbf 9e99aa 8a8695 777380 635f6a 4f4c55 3b3940 27262a 141315

Palette

Tints

Mixed toward white — soft backgrounds and highlights

fefdff fcfbff fbf9ff f9f6ff f8f4ff f6f2ff f4f0ff f3eeff f2ecff f0e9ff efe7ff

Palette

Shades

Mixed toward black — depth, text, and emphasis

d9d2ea c6bfd5 b2acbf 9e99aa 8a8695 777380 635f6a 4f4c55 3b3940 27262a 141315

Palette

Tones

Mixed toward neutral grey — muted UI surfaces

e4ddf4 dbd4ea d2ccdf c9c3d5 c0bbca b7b3c0 adaab5 a4a2aa 9b99a0 929195 89888b

Harmony

Complementary

Opposite on the color wheel for contrast

#EDE5FFStop 1 #F7FFE5Stop 2

Harmony

Analogous

Neighbors that sit comfortably together

#E5EBFFStop 1 #EDE5FFStop 2 #FAE5FFStop 3

Harmony

Triadic

Evenly spaced triad for vibrant sets

#EDE5FFStop 1 #FFEDE5Stop 2 #E5FFEDStop 3

Harmony

Split complementary

Base plus two accents beside the complement

#EDE5FFStop 1 #FFFAE5Stop 2 #EBFFE5Stop 3

Harmony

Monochromatic

Same hue, varied lightness and saturation

#1F0066Stop 1 #3600B3Stop 2 #4C00FFStop 3 #824DFFStop 4 #B899FFStop 5

Using this color

Where #ede5ff works

#EDE5FF (#ede5ff) sits in the deep purple family at about 258° hue, 100% saturation, and 95% lightness. Contrast is 1.22:1 on white and 17.25:1 on black, so near-black labels read more clearly on the swatch itself. Nearest Tailwind token: purple-100 (approximation unless the hex is an official scale stop).

Sensible jobs for this swatch

page or card backgrounds
text or icons on charcoal / dark mode

Do not use #ede5ff as small body text on white — 1.22:1 misses WCAG AA (4.5:1). Pair it with a darker shade from the scale below, or check pairs in the contrast checker.

Family context: Mystery, ambition, and creativity. Strong for artistic and spiritual associations. Common uses still include buttons, charts, and accents in the Deep Purple range — always verify the pair for this exact hex in the contrast checker.

Similar & related colors

Nearby colors from the library by perceptual distance

Tailwind purple 100#F3E8FF Tailwind violet 100#EDE9FE Tailwind fuchsia 100#FAE8FF Lavender#E6E6FA Material Deep Purple 50#EDE7F6 Material Purple 50#F3E5F5 Tailwind violet 200#DDD6FE Tailwind fuchsia 50#FDF4FF Tailwind indigo 100#E0E7FF Tailwind violet 50#F5F3FF Tailwind purple 200#E9D5FF Tailwind pink 100#FCE7F3