#73CFD5

Accessibility

AAA

11.61:1

Vs white / black

1.81:1 · 11.61:1

Sources

Library color

Codes

Formats

HEX

#73cfd5

RGB

rgb(115, 207, 213)

RGBA

rgba(115, 207, 213, 1)

HSL

hsl(184, 54%, 64%)

HSLA

hsla(184, 54%, 64%, 1)

HSV

hsv(184, 46%, 84%)

LAB

lab(77.92% -25.83 -11.51)

LCH

lch(77.92% 28.28 204.02)

OKLAB

oklab(0.7998 -0.0824 -0.0317)

OKLCH

oklch(0.7998 0.0883 201.04)

XYZ

xyz(41.39, 53.07, 71.00)

CMYK

cmyk(46%, 3%, 0%, 16%)

CSS

color: #73cfd5;

CSS variable

--color-73cfd5: #73cfd5;

SCSS

$color-73cfd5: #73cfd5;

JavaScript

const color = "#73cfd5";

TypeScript

const color: string = "#73cfd5";

React

style={{ backgroundColor: "#73cfd5" }}

JSON

{ "hex": "#73cfd5", "rgb": { "r": 115, "g": 207, "b": 213 }, "oklch": "oklch(0.7998 0.0883 201.04)" }

Export

Developer code

css

:root {
  --#73cfd5-1: #73cfd5;
}

Design systems

Nearest official tokens

An arbitrary HEX is not an official Tailwind, Material, or Bootstrap color. Distance is CIEDE2000.

Nearest Tailwind color

cyan-300

Very different · ΔE 6.76 · #67E8F9

Nearest CSS named color

MediumTurquoise

Very different · ΔE 6.01 · #48D1CC

Nearest Material color

cyan-300

Noticeably different · ΔE 4.16 · #4DD0E1

Nearest Bootstrap color

info

Very different · ΔE 9.75 · #0DCAF0

OKLCH

Perceptual 50–950 scale

Generated in OKLCH from this hex. Not an official Tailwind scale unless the hex itself is a Tailwind token.

50ccffff 100baf4f8 2009ee2e7 3007ecdd2 40055b2b8 50036969c 6002a7e83 7001d6569 800114d51 900053639 950002023

Palette

Tints & shades

Full scale from light tints through the base color into deep shades

f3fbfc e8f7f8 dcf3f5 d0eff1 c5ebee b9e7ea ade3e7 a2dfe3 96dbe0 8ad7dc 7fd3d9 73cfd5 69bec3 60adb2 569ba0 4d8a8e 43797c 3a686b 305659 264547 1d3435 132223 0a1112

Palette

Tints

Mixed toward white — soft backgrounds and highlights

f3fbfc e8f7f8 dcf3f5 d0eff1 c5ebee b9e7ea ade3e7 a2dfe3 96dbe0 8ad7dc 7fd3d9

Palette

Shades

Mixed toward black — depth, text, and emphasis

69bec3 60adb2 569ba0 4d8a8e 43797c 3a686b 305659 264547 1d3435 132223 0a1112

Palette

Tones

Mixed toward neutral grey — muted UI surfaces

74c8ce 75c2c7 76bbc0 77b5b9 78aeb2 7aa8ab 7ba1a3 7c9a9c 7d9495 7e8d8e 7f8787

Harmony

Complementary

Opposite on the color wheel for contrast

#73CFD5Stop 1 #D57872Stop 2

Harmony

Analogous

Neighbors that sit comfortably together

#72D5AAStop 1 #73CFD5Stop 2 #729DD5Stop 3

Harmony

Triadic

Evenly spaced triad for vibrant sets

#73CFD5Stop 1 #D572CEStop 2 #CED572Stop 3

Harmony

Split complementary

Base plus two accents beside the complement

#73CFD5Stop 1 #D5729DStop 2 #D5AA72Stop 3

Harmony

Monochromatic

Same hue, varied lightness and saturation

#174B4FStop 1 #298389Stop 2 #3BBBC4Stop 3 #76D0D6Stop 4 #B0E4E8Stop 5

Using this color

Where #73cfd5 works

#73CFD5 (#73cfd5) sits in the cyan family at about 184° hue, 54% saturation, and 64% lightness. Contrast is 1.81:1 on white and 11.61:1 on black, so near-black labels read more clearly on the swatch itself. Nearest Tailwind token: cyan-300 (approximation unless the hex is an official scale stop).

Sensible jobs for this swatch

supporting UI accents
text or icons on charcoal / dark mode

Do not use #73cfd5 as small body text on white — 1.81:1 misses WCAG AA (4.5:1). Pair it with a darker shade from the scale below, or check pairs in the contrast checker.

Family context: Freshness, clarity, and innovation. Great for tech accents and clean digital products. Common uses still include buttons, charts, and accents in the Cyan range — always verify the pair for this exact hex in the contrast checker.

Similar & related colors

Nearby colors from the library by perceptual distance

Spectrum #66CCD1#66CCD1 Spectrum #80D5DB#80D5DB Web Safe #66CCCC#66CCCC Spectrum #5ED8E4#5ED8E4 Spectrum #83CECB#83CECB Spectrum #87C7C9#87C7C9 Spectrum #3DD1DB#3DD1DB Material Cyan 300#4DD0E1 Material Cyan 200#80DEEA Spectrum #85CAD6#85CAD6 Spectrum #7FE0EB#7FE0EB Spectrum #80E0DF#80E0DF