Pastel pink to HSL — Color Code

#ffbacd
Format Value
HEX #ffbacd
RGB rgb(255, 186, 205)
HSL hsl(343.5, 100%, 86.5%)
CMYK cmyk(0%, 27.1%, 19.6%, 0%)
HSV hsv(343.5, 27.1%, 100%)

pastel pink color harmonies

Tints & shades of pastel pink

Tints (lighter)

#ffc0d2 #ffc7d6 #ffcddb #ffd3df #ffd9e4 #ffe0e8 #ffe6ed #ffecf1 #fff2f6 #fff9fa

Shades (darker)

#e8a9ba #d198a8 #b98795 #a27682 #8b6570 #74555d #5d444b #463338 #2e2225 #171113

Contrast & accessibility

The quick brown fox

On white · 1.6:1 · Fail

The quick brown fox

On black · 13.16:1 · AAA

Recommended text color: #000000

Use pastel pink in code

CSS color: #ffbacd;
SCSS $color: #ffbacd;
Tailwind bg-[#ffbacd]
Swift UIColor(red: 1.000, green: 0.729, blue: 0.804, alpha: 1)
Android Color.parseColor("#ffbacd")
Flutter Color(0xFFFFBACD)

Colors similar to pastel pink

Browse all Pink colors →

What is the HSL code for pastel pink?

The CSS color pastel pink in HSL format is hsl(343.5, 100%, 86.5%). Use this value directly in CSS, SVG, and most design tools.

How do I use pastel pink in CSS?

To apply pastel pink in CSS:

  • Text color: color: hsl(343.5, 100%, 86.5%);
  • Background: background-color: hsl(343.5, 100%, 86.5%);
  • Border: border-color: hsl(343.5, 100%, 86.5%);

What are all the color format values for pastel pink?

FormatValue
HEX#ffbacd
RGBrgb(255, 186, 205)
HSLhsl(343.5, 100%, 86.5%)
CMYKcmyk(0%, 27.1%, 19.6%, 0%)

How do I convert pastel pink to HSL?

Select pastel pink from the color name list in our color converter. The HSL value — hsl(343.5, 100%, 86.5%) — appears instantly alongside HEX, RGB, HSL and CMYK.

What color family does pastel pink belong to?

pastel pink belongs to the pink color family. It is a light, vivid color with HSL values: hue 343.5°, saturation 100%, lightness 86.5%.

How do I create lighter and darker shades of pastel pink?

Lighter variant (lightness 95%): #ffe5ed. Darker variant (lightness 71.5%): #ff6e96. These values are computed by adjusting HSL lightness ±15% while keeping the same hue and saturation.

What is HSL used for?

HSL describes colors by hue (0–360°), saturation (0–100%) and lightness (0–100%). It is more intuitive for designers — easy to create lighter, darker or less saturated variants of any color.