Maroon Colors  ·  Color Library

Palettes / Colors / #FDDEF7

#FDDEF7 — Pale Vivid Pink

#FDDEF7 is a pink color we call Pale Vivid Pink, closest to the named color LavenderBlush (#FFF0F5). It belongs to the pink family.

Color name

Closest CSS keyword: lavenderblush (#FFF0F5) — not an exact match. CSS lavenderblush gives you #FFF0F5, a different color; use #FDDEF7 when you need this exact shade.

Sources: common names follow widely used color-name references; CSS keywords and their hex values follow the CSS Color specification.

#FDDEF7 is a warm-leaning pink color associated with playfulness, romance and softness. It is light enough to work as a background or base color, with darker text on top.

Its strongest partner is its complement #DDFDE4; it also sits naturally between #F4DDFD and #FDDDE7. In the palettes below you can see it working alongside real color combinations from our collection.

#FDDEF7 · RGB 253, 222, 247

Download PNG swatch SVG

Color values

HEX#FDDEF7
RGB253, 222, 247
HSL312°, 89%, 93%
HSV312°, 12%, 99%
CMYK0%, 12%, 2%, 1%
XYZ83.42, 79.84, 99.01
Yxy79.84, 0.3181, 0.3044
CIE-Lab91.61, 14.86, -8.22
Hunter Lab89.35, 15.29, -8.32

RGB & CMYK percentages

Red 99% · Green 87% · Blue 97%

Cyan 0% · Magenta 12% · Yellow 2% · Key 1%

CMYK values are unprofiled approximations for screen reference — not a print-proofing guarantee.

Previews

Sample text in #FDDEF7 on black
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Sample text in #FDDEF7 on white
Lorem ipsum dolor sit amet, consectetur adipiscing elit.

CSS code for #FDDEF7

.text { color: #FDDEF7; }
.background { background-color: #FDDEF7; }
.border { border: 3px solid #FDDEF7; }
.text-rgb { color: rgb(253, 222, 247); }
.text-hsl { color: hsl(312, 89%, 93%); }
.text-shadow-hex { text-shadow: 4px 4px 2px #FDDEF7; }
.text-shadow-rgba { text-shadow: 4px 4px 2px rgba(253, 222, 247, 0.8); }
.box-shadow-hex { box-shadow: 1px 1px 3px 2px #FDDEF7; }
.box-shadow-rgba { box-shadow: 1px 1px 3px 2px rgba(253, 222, 247, 0.8); }

HTML: <p style="color:#FDDEF7">Text here</p> · <div style="background-color:#FDDEF7">Div content here</div>

Shades of #FDDEF7

#FBB2EC#F887E1#F55BD7#F330CC#EC0EC0#C10B9C#950979#6A0656#3F0433#130110

Tints of #FDDEF7

#FDDDF7#FDE2F8#FDE2F8#FDE2F8#FEE7F9#FEE7F9#FEE7F9#FEE7F9#FEECFA#FEECFA

Tones of #FDDEF7

#FBE0F5#F9E2F4#F6E4F3#F4E6F1#F2E9F0#EFEBEF

Color harmonies

Complementary — #DDFDE4:

Analogous:

Triadic:

Contrast & accessibility

Against white text1.24:1 Fails
Against black text16.97:1 AAA

Best text color on #FDDEF7: #000000.

Semi-transparent (opacity) text on #FDDEF7

Text set with opacity blends into the background, so its real contrast is lower than the solid ratios above. Choose a text color and an opacity to see the blended color and its true ratio:

100%
Sample heading text
Smaller body text shows the effect best.

Blended color: · Contrast against #FDDEF7: ·

How #FDDEF7 looks with color blindness

Simulated with standard Machado color-vision-deficiency matrices — useful when this color carries meaning in charts, maps or interfaces:

Protanopia · #F0EFF1Deuteranopia · #F1F4EFTritanopia · #FBECEB

Closest design-system colors

The nearest matches in the Tailwind CSS, Material Design and Bootstrap palettes — handy when you need a framework class instead of a raw hex:

Bootstrap light · #F8F9FAMaterial Grey 500 · #9E9E9ETailwind fuchsia 500 · #D946EF

Palettes with a similar color

These palettes use a close neighbour of #FDDEF7 rather than the exact color:

Palette 2a2f4f
#2A2F4F · #917FB3 · #E5BEEC · #FDE2F3
Palette 6367ff
#6367FF · #8494FF · #C9BEFF · #FFDBFD
Palette Cff6cf
#CFF6CF · #CFE5CF · #E5CFE5 · #F6DEF6
Palette B9f3fc
#B9F3FC · #AEE2FF · #93C6E7 · #FEDEFF
Palette 937dc2
#937DC2 · #C689C6 · #FFABE1 · #FFE6F7
Palette Aa60c8
#AA60C8 · #D69ADE · #EABDE6 · #FFDFEF

Similar colors

The closest colors that actually appear in our palette collection — click any to open its page:

#FDE2F3#FFDBFD#F6DEF6#FEDEFF#FFE6F7#FFDFEF#FFE1FF#FFE3FE#FFE2FF#FFE5F1#F7DBF0#F6E5F5

Browse neighbouring colors

← #FDDEF6  ·  #FDDEF8 →

Frequently asked questions

What color is #FDDEF7?

#FDDEF7 is Pale Vivid Pink, a pink color (RGB 253, 222, 247). Its closest standard named color is LavenderBlush.

What is the RGB and HSL of #FDDEF7?

#FDDEF7 is RGB 253, 222, 247 — HSL 312°, 89%, 93% — CMYK 0%, 12%, 2%, 1%.

What colors go with #FDDEF7?

Its complement is #DDFDE4; analogous partners are #F4DDFD and #FDDDE7. It also appears in 6+ palettes in our collection.

Can I use #FDDEF7 for text?

Black text on #FDDEF7 has a contrast ratio of 16.97:1 (passes WCAG AA); white text gives 1.24:1.