#BD2EBD

Accessibility

4.9:1

Vs white / black

4.9:1 · 4.29:1

Sources

Library color

Codes

Formats

HEX

#bd2ebd

RGB

rgb(189, 46, 189)

RGBA

rgba(189, 46, 189, 1)

HSL

hsl(300, 61%, 46%)

HSLA

hsla(300, 61%, 46%, 1)

HSV

hsv(300, 76%, 74%)

LAB

lab(47.56% 70.76 -44.38)

LCH

lch(47.56% 83.53 327.9)

OKLAB

oklab(0.5787 0.1975 -0.123)

OKLCH

oklch(0.5787 0.2327 328.09)

XYZ

xyz(31.15, 16.45, 49.67)

CMYK

cmyk(0%, 76%, 0%, 26%)

CSS

color: #bd2ebd;

CSS variable

--color-bd2ebd: #bd2ebd;

SCSS

$color-bd2ebd: #bd2ebd;

JavaScript

const color = "#bd2ebd";

TypeScript

const color: string = "#bd2ebd";

React

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

JSON

{ "hex": "#bd2ebd", "rgb": { "r": 189, "g": 46, "b": 189 }, "oklch": "oklch(0.5787 0.2327 328.09)" }

Export

Developer code

css

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

Design systems

Nearest official tokens

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

Nearest Tailwind color

fuchsia-600

Noticeably different · ΔE 3.34 · #C026D3

Nearest CSS named color

MediumOrchid

Very different · ΔE 7.41 · #BA55D3

Nearest Material color

purple-400

Noticeably different · ΔE 3.85 · #AB47BC

Nearest Bootstrap color

secondary

Very different · ΔE 20.55 · #6C757D

OKLCH

Perceptual 50–950 scale

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

50ffd3ff 100ffc2ff 200ffa6ff 300ff87ff 400ea5ee9 500cb3ecb 600ab32ab 7008b248b 8006c166c 9004f084f 950340035

Palette

Tints & shades

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

faeefa f4dcf4 efcbef e9b9e9 e4a8e4 de97de d985d9 d374d3 ce62ce c851c8 c33fc3 bd2ebd ad2aad 9e269e 8e238e 7e1f7e 6e1b6e 5f175f 4f134f 3f0f3f 2f0c2f 1f081f 100410

Palette

Tints

Mixed toward white — soft backgrounds and highlights

faeefa f4dcf4 efcbef e9b9e9 e4a8e4 de97de d985d9 d374d3 ce62ce c851c8 c33fc3

Palette

Shades

Mixed toward black — depth, text, and emphasis

ad2aad 9e269e 8e238e 7e1f7e 6e1b6e 5f175f 4f134f 3f0f3f 2f0c2f 1f081f 100410

Palette

Tones

Mixed toward neutral grey — muted UI surfaces

b835b8 b33cb3 ae43ae a949a9 a450a4 9f579f 995e99 946594 8f6c8f 8a728a 857985

Harmony

Complementary

Opposite on the color wheel for contrast

#BD2EBDStop 1 #2EBD2EStop 2

Harmony

Analogous

Neighbors that sit comfortably together

#752EBDStop 1 #BD2EBDStop 2 #BD2E75Stop 3

Harmony

Triadic

Evenly spaced triad for vibrant sets

#BD2EBDStop 1 #BDBD2EStop 2 #2EBDBDStop 3

Harmony

Split complementary

Base plus two accents beside the complement

#BD2EBDStop 1 #75BD2EStop 2 #2EBD75Stop 3

Harmony

Monochromatic

Same hue, varied lightness and saturation

#521452Stop 1 #902390Stop 2 #CD32CDStop 3 #DC6FDCStop 4 #EBADEBStop 5

Using this color

Where #bd2ebd works

#BD2EBD (#bd2ebd) sits in the pink family at about 300° hue, 61% saturation, and 46% lightness. Contrast is 4.9:1 on white and 4.29:1 on black, so white labels read more clearly on the swatch itself. Nearest Tailwind token: fuchsia-600 (approximation unless the hex is an official scale stop).

Sensible jobs for this swatch

primary buttons and key accents
text or icons on a white canvas

On a black or near-black UI, #bd2ebd is 4.29:1. Prefer it as a fill, border, or large heading rather than 16px copy.

Family context: Compassion, playfulness, and romance. Popular in beauty, lifestyle, and youth-focused products. Common uses still include buttons, charts, and accents in the Pink range — always verify the pair for this exact hex in the contrast checker.

Similar & related colors

Nearby colors from the library by perceptual distance

Web Safe #CC00CC#CC00CC Tailwind fuchsia 600#C026D3 Material Purple 400#AB47BC Web Safe #CC33CC#CC33CC Radix Purple 9#AB4ABA Fluent Magenta#B4009E Tailwind fuchsia 700#A21CAF Material Purple 500#9C27B0 MediumOrchid#BA55D3 Web Safe #CC0099#CC0099 Web Safe #9933CC#9933CC DarkOrchid#9932CC