Turquoise to HSL

Color Code

#40e0d0
Format Value
HEX #40e0d0
RGB rgb(64, 224, 208)
HSL hsl(174, 72.1%, 56.5%)
CMYK cmyk(71.4%, 0%, 7.1%, 12.2%)
HSV hsv(174, 71.4%, 87.8%)

turquoise color harmonies

Tints & shades of turquoise

Tints (lighter)

#51e3d4 #63e6d9 #74e8dd #85ebe1 #97eee5 #a8f1ea #baf4ee #cbf7f2 #dcf9f6 #eefcfb

Shades (darker)

#3accbd #34b7aa #2fa397 #298f84 #237a71 #1d665f #17514c #113d39 #0c2926 #061413

Contrast & accessibility

The quick brown fox

On white · 1.64:1 · Fail

The quick brown fox

On black · 12.79:1 · AAA

Recommended text color: #000000

Use turquoise in code

CSS color: #40e0d0;
SCSS $color: #40e0d0;
Tailwind bg-[#40e0d0]
Swift UIColor(red: 0.251, green: 0.878, blue: 0.816, alpha: 1)
Android Color.parseColor("#40e0d0")
Flutter Color(0xFF40E0D0)

Colors similar to turquoise

Browse all Cyan colors →

What is the HSL code for turquoise?

The CSS color turquoise in HSL format is hsl(174, 72.1%, 56.5%). Use this value directly in CSS, SVG, and most design tools.

How do I use turquoise in CSS?

To apply turquoise in CSS:

  • Text color: color: hsl(174, 72.1%, 56.5%);
  • Background: background-color: hsl(174, 72.1%, 56.5%);
  • Border: border-color: hsl(174, 72.1%, 56.5%);

What are all the color format values for turquoise?

FormatValue
HEX#40e0d0
RGBrgb(64, 224, 208)
HSLhsl(174, 72.1%, 56.5%)
CMYKcmyk(71.4%, 0%, 7.1%, 12.2%)

How do I convert turquoise to HSL?

Select turquoise from the color name list in our color converter. The HSL value — hsl(174, 72.1%, 56.5%) — appears instantly alongside HEX, RGB, HSL and CMYK.

What color family does turquoise belong to?

turquoise belongs to the cyan color family. It is a medium, vivid color with HSL values: hue 174°, saturation 72.1%, lightness 56.5%.

How do I create lighter and darker shades of turquoise?

Lighter variant (lightness 71.5%): #82ebe0. Darker variant (lightness 41.5%): #1eb6a7. 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.