Wintergreen to HSL — Color Code

#20f986
Format Value
HEX #20f986
RGB rgb(32, 249, 134)
HSL hsl(148.2, 94.8%, 55.1%)
CMYK cmyk(87.1%, 0%, 46.2%, 2.4%)
HSV hsv(148.2, 87.1%, 97.6%)

wintergreen color harmonies

Tints & shades of wintergreen

Tints (lighter)

#34fa91 #49fa9c #5dfba7 #71fbb2 #85fcbd #9afcc8 #aefdd3 #c2fdde #d6fee9 #ebfef4

Shades (darker)

#1de27a #1acc6e #17b561 #149e55 #118849 #0f713d #0c5b31 #094425 #062d18 #03170c

Contrast & accessibility

The quick brown fox

On white · 1.4:1 · Fail

The quick brown fox

On black · 14.96:1 · AAA

Recommended text color: #000000

Use wintergreen in code

CSS color: #20f986;
SCSS $color: #20f986;
Tailwind bg-[#20f986]
Swift UIColor(red: 0.125, green: 0.976, blue: 0.525, alpha: 1)
Android Color.parseColor("#20f986")
Flutter Color(0xFF20F986)

Colors similar to wintergreen

Browse all Green colors →

What is the HSL code for wintergreen?

The CSS color wintergreen in HSL format is hsl(148.2, 94.8%, 55.1%). Use this value directly in CSS, SVG, and most design tools.

How do I use wintergreen in CSS?

To apply wintergreen in CSS:

  • Text color: color: hsl(148.2, 94.8%, 55.1%);
  • Background: background-color: hsl(148.2, 94.8%, 55.1%);
  • Border: border-color: hsl(148.2, 94.8%, 55.1%);

What are all the color format values for wintergreen?

FormatValue
HEX#20f986
RGBrgb(32, 249, 134)
HSLhsl(148.2, 94.8%, 55.1%)
CMYKcmyk(87.1%, 0%, 46.2%, 2.4%)

How do I convert wintergreen to HSL?

Select wintergreen from the color name list in our color converter. The HSL value — hsl(148.2, 94.8%, 55.1%) — appears instantly alongside HEX, RGB, HSL and CMYK.

What color family does wintergreen belong to?

wintergreen belongs to the green color family. It is a medium, vivid color with HSL values: hue 148.2°, saturation 94.8%, lightness 55.1%.

How do I create lighter and darker shades of wintergreen?

Lighter variant (lightness 70.1%): #6afbae. Darker variant (lightness 40.1%): #05c760. 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.