CSS named colour

Medium Turquoise

#48d1cc

A CSS named colour: mediumturquoise is valid anywhere a colour is expected.

RGB: rgb(72 209 204)
HSL: 178°, 60%, 55%
OKLCh: 78.7% 0.116 191.6

Medium Turquoise in every format

Web & CSSThe everyday formats for stylesheets and design tools.

Hex	`#48d1cc`
RGB	`rgb(72 209 204)`
RGB legacy	`rgb(72, 209, 204)`
RGB percent	`rgb(28.24% 81.96% 80%)`
HSL	`hsl(177.8 59.8% 55.1%)`
HSL legacy	`hsl(177.8, 59.8%, 55.1%)`
HSV / HSB	`hsv(177.8, 65.6%, 82%)`
HWB	`hwb(177.8 28.2% 18%)`
Nearest name	`mediumturquoise`
CMYK	`cmyk(65.6%, 0%, 2.4%, 18%)`Naive conversion. Real print work needs an ICC profile.

Perceptual & wide gamutModern CSS colour spaces for uniform scales and P3 displays.

OKLCh	`oklch(78.68% 0.11622 191.558)`Modern CSS colour space for even palettes — better than HSL when building scales.
OKLab	`oklab(78.68% -0.11387 -0.02329)`
CIE LCh	`lch(76.564% 39.904 192.993)`
CIE Lab	`lab(76.564% -38.883 -8.972)`
Display P3	`color(display-p3 0.4448 0.8086 0.796)`
Rec. 2020	`color(rec2020 0.5174 0.7727 0.7729)`
srgb-linear	`color(srgb-linear 0.0648 0.6376 0.6038)`Light-linear sRGB — the same numbers a shader wants for maths.
CIE XYZ (D65)	`color(xyz-d65 0.3637 0.5134 0.6512)`

ShadersGLSL, HLSL and WGSL vectors in both encoded and linear form.

GLSL vec3 — sRGB	`vec3(0.282, 0.82, 0.8)`Encoded values. Use when writing straight to the framebuffer.
GLSL vec3 — linear	`vec3(0.065, 0.638, 0.604)`Light-linear values. Use for lighting, blending and mixing.
GLSL vec4 — sRGB	`vec4(0.282, 0.82, 0.8, 1.0)`
GLSL vec4 — linear	`vec4(0.065, 0.638, 0.604, 1.0)`
GLSL ivec3	`ivec3(72, 209, 204)`
HLSL float3 — sRGB	`float3(0.282, 0.82, 0.8)`
HLSL float3 — linear	`float3(0.065, 0.638, 0.604)`
HLSL float4 — sRGB	`float4(0.282, 0.82, 0.8, 1.0)`
HLSL half4 — sRGB	`half4(0.282, 0.82, 0.8, 1.0)`
WGSL vec3f — sRGB	`vec3f(0.282, 0.82, 0.8)`
WGSL vec4f — sRGB	`vec4f(0.282, 0.82, 0.8, 1.0)`
WGSL vec3<f32> — linear	`vec3<f32>(0.065, 0.638, 0.604)`

Engines & appsConstructors for Unity, Unreal, Godot, Flutter, SwiftUI and Android.

Unity Color	`new Color(0.282f, 0.82f, 0.8f, 1.0f)`Color for everyday scripting (0–1). Color32 when you need whole numbers from 0 to 255.
Unity Color32	`new Color32(72, 209, 204, 255)`
Unreal FLinearColor	`FLinearColor(0.0648f, 0.6376f, 0.6038f, 1.0f)`FLinearColor for materials and lighting. FColor when you need whole numbers from 0 to 255.
Unreal FColor	`FColor(72, 209, 204, 255)`Whole numbers from 0 to 255 — use when an API asks for FColor, not FLinearColor.
Godot Color	`Color(0.282, 0.82, 0.8, 1)`
Flutter Color	`Color(0xFF48D1CC)`Packed ARGB, so alpha comes first.
Android Color	`Color.rgb(72, 209, 204)`
SwiftUI Color	`Color(red: 0.282, green: 0.82, blue: 0.8)`
UIKit UIColor	`UIColor(red: 0.282, green: 0.82, blue: 0.8, alpha: 1)`

Raw valuesPacked integers and plain arrays.

0x hex	`0x48D1CC`
0x hex (ARGB)	`0xFF48D1CC`
Array 0–1	`[0.282, 0.82, 0.8]`
Array 0–255	`[72, 209, 204]`
Decimal integer	`4772300`

Contrast and accessibility

WCAG 2 ratios are what audits and legislation reference. APCA is shown alongside because WCAG 2 is known to misjudge mid-tone backgrounds, and it is the basis of the WCAG 3 draft.

Pairing	WCAG 2 ratio	Level	APCA	Suitable for
Medium Turquoise on white	1.86:1	Fail	Lc 35	Non-text elements only
Medium Turquoise on black	11.27:1	AAA	Lc 68	Headings and large text

Medium Turquoise text on a white background

Medium Turquoise text on a black background

White text on Medium Turquoise

Black text on Medium Turquoise

Tonal scale

Hue held fixed while lightness walks OKLCh, ready to use as a design system ramp.

50#c2ffff
100#a2fffd
200#8af1ec
300#69dbd7
400#3abfbb
500#00a19d
600#008582
700#006c69
800#005653
900#004442
950#002826

Tints and shades

Mixed perceptually toward white and black, so the steps feel evenly spaced.

Tint 1#72d9d4
Tint 2#93e1dd
Tint 3#b0e9e5
Tint 4#cbf0ee
Tint 5#e5f8f6
Shade 1#36a4a0
Shade 2#267875
Shade 3#16504e
Shade 4#082a29
Shade 5#010a09

Colours that work with Medium Turquoise

Complementary, triadic and analogous partners, rotated in OKLCh so they keep the same apparent brightness.

#fa9aa6
#d2a4f0
#e8ad61
#6ed1a2
#54caee

Closest CSS names

mediumturquoiseexact match
darkturquoiseΔEok 0.024
turquoiseΔEok 0.041
mediumaquamarineΔEok 0.046
skyblueΔEok 0.072
lightskyblueΔEok 0.090