HSL(172, 30%, 65%)

Cyan — Cyan color

Adjust Color

Color Information

Color Name

Cyan

Color Family

Cyan

Warm / Cool

🔵 Cool

Temperature

7000K

CSS Class

bg-[hsl(172,30%,65%)]

Color Conversions

Format Value CSS Usage
HSL hsl(172, 30%, 65%) color: hsl(172, 30%, 65%)
HEX #8BC1B9 color: #8BC1B9
RGB rgb(139, 193, 185) color: rgb(139, 193, 185)
CMYK cmyk(28%, 0%, 4%, 24%) —
HSV hsv(171, 28%, 76%) —
HWB hwb(171 55% 24%) color: hwb(171 55% 24%)
OKLCH oklch(0.7711 0.0575 184.69) color: oklch(0.7711 0.0575 184.69)
Lab lab(74.27 -19.25 -1.64) color: lab(74.27 -19.25 -1.64)
LCH lch(74.27 19.32 184.87) color: lch(74.27 19.32 184.87)

Color Theory

Complementary

Triadic

Analogous

Tetradic (Square)

Split-Complementary

Accessibility (WCAG)

White text on color

Black text on color

Color on white bg

Colored text

Contrast Ratios

vs White 2.01:1
vs Black 10.43:1

AA Normal (4.5:1)

on White: FAIL ✗ on Black: PASS ✓

AA Large (3:1)

on White: FAIL ✗ on Black: PASS ✓

AAA Normal (7:1)

on White: FAIL ✗

Best text on this color: black

Color Blindness Simulation

Protanopia (Red-blind)

#A2A3BB — rgb(162, 163, 187)

Deuteranopia (Green-blind)

#9F9BBB — rgb(159, 155, 187)

Tritanopia (Blue-blind)

#8EBCBD — rgb(142, 188, 189)

Tints & Shades

Tints (Lighter →)

← Shades (Darker)

Saturation (0% → 100%)

CSS Code Snippets

background

background-color: hsl(172, 30%, 65%);

text

color: hsl(172, 30%, 65%);

border

border: 2px solid hsl(172, 30%, 65%);

gradient light

background: linear-gradient(to right, hsl(172, 30%, 85%), hsl(172, 30%, 65%));

gradient dark

background: linear-gradient(to right, hsl(172, 30%, 65%), hsl(172, 30%, 45%))

hex

background-color: #8BC1B9;

tailwind

bg-[hsl(172,30%,65%)]

box shadow

box-shadow: 0 4px 6px -1px hsl(172, 30%, 65%, 0.4);

css variable

--color-primary: hsl(172, 30%, 65%);

Related Colors

#9DAFAC

172,10,65

#79D2C6

172,50,65

#50958C

172,30,45

#CDE4E1

172,30,85

#8BC1AC

157,30,65

#8BC1B0

162,30,65

#8BBFC1

182,30,65

#8BBAC1

187,30,65

Use Cases for Cyan

Tech/SaaS products Medical apps Water/ocean themes Clean UI elements Data viz

Frequently Asked Questions

What are all the color codes for HSL(172, 30%, 65%)?

HEX: #8BC1B9 | RGB: rgb(139, 193, 185) | CMYK: 28%, 0%, 4%, 24% | HSV: 171°, 28%, 76%. Copy any format from the conversion table above.

What colors go well with #8BC1B9?

The complementary color is HSL(352, 30%, 65%). For a triadic harmony, use hues 172°, 292°, and 52°. For analogous combinations, try hues 142° and 202°. See the Color Harmony section above for complete palettes with previews.

How do I use HSL(172, 30%, 65%) in CSS?

As HSL: color: hsl(172, 30%, 65%); — As HEX: color: #8BC1B9; — As RGB: color: rgb(139, 193, 185); — Tailwind CSS: bg-[hsl(172,30%,65%)] — CSS variable: --color-primary: hsl(172, 30%, 65%);