Colour reference

Purple 500

#a855f7

RGB: rgb(168 85 247)
HSL: 271°, 91%, 65%
OKLCh: 62.7% 0.233 303.9

Purple 500 in every format

Web & CSSThe everyday formats for stylesheets and design tools.

Hex	`#a855f7`
RGB	`rgb(168 85 247)`
RGB legacy	`rgb(168, 85, 247)`
RGB percent	`rgb(65.88% 33.33% 96.86%)`
HSL	`hsl(270.7 91% 65.1%)`
HSL legacy	`hsl(270.7, 91%, 65.1%)`
HSV / HSB	`hsv(270.7, 65.6%, 96.9%)`
HWB	`hwb(270.7 33.3% 3.1%)`
Nearest name	`mediumorchid (approx.)`
CMYK	`cmyk(32%, 65.6%, 0%, 3.1%)`Naive conversion. Real print work needs an ICC profile.

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

OKLCh	`oklch(62.685% 0.23254 303.9)`Modern CSS colour space for even palettes — better than HSL when building scales.
OKLab	`oklab(62.685% 0.1297 -0.19301)`
CIE LCh	`lch(52.799% 88.846 309.301)`
CIE Lab	`lab(52.799% 56.274 -68.752)`
Display P3	`color(display-p3 0.6165 0.3506 0.9358)`
Rec. 2020	`color(rec2020 0.5552 0.3259 0.9211)`
srgb-linear	`color(srgb-linear 0.3916 0.0908 0.9301)`Light-linear sRGB — the same numbers a shader wants for maths.
CIE XYZ (D65)	`color(xyz-d65 0.3618 0.2154 0.9025)`

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

GLSL vec3 — sRGB	`vec3(0.659, 0.333, 0.969)`Encoded values. Use when writing straight to the framebuffer.
GLSL vec3 — linear	`vec3(0.392, 0.091, 0.93)`Light-linear values. Use for lighting, blending and mixing.
GLSL vec4 — sRGB	`vec4(0.659, 0.333, 0.969, 1.0)`
GLSL vec4 — linear	`vec4(0.392, 0.091, 0.93, 1.0)`
GLSL ivec3	`ivec3(168, 85, 247)`
HLSL float3 — sRGB	`float3(0.659, 0.333, 0.969)`
HLSL float3 — linear	`float3(0.392, 0.091, 0.93)`
HLSL float4 — sRGB	`float4(0.659, 0.333, 0.969, 1.0)`
HLSL half4 — sRGB	`half4(0.659, 0.333, 0.969, 1.0)`
WGSL vec3f — sRGB	`vec3f(0.659, 0.333, 0.969)`
WGSL vec4f — sRGB	`vec4f(0.659, 0.333, 0.969, 1.0)`
WGSL vec3<f32> — linear	`vec3<f32>(0.392, 0.091, 0.93)`

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

Unity Color	`new Color(0.659f, 0.333f, 0.969f, 1.0f)`Color for everyday scripting (0–1). Color32 when you need whole numbers from 0 to 255.
Unity Color32	`new Color32(168, 85, 247, 255)`
Unreal FLinearColor	`FLinearColor(0.3916f, 0.0908f, 0.9301f, 1.0f)`FLinearColor for materials and lighting. FColor when you need whole numbers from 0 to 255.
Unreal FColor	`FColor(168, 85, 247, 255)`Whole numbers from 0 to 255 — use when an API asks for FColor, not FLinearColor.
Godot Color	`Color(0.659, 0.333, 0.969, 1)`
Flutter Color	`Color(0xFFA855F7)`Packed ARGB, so alpha comes first.
Android Color	`Color.rgb(168, 85, 247)`
SwiftUI Color	`Color(red: 0.659, green: 0.333, blue: 0.969)`
UIKit UIColor	`UIColor(red: 0.659, green: 0.333, blue: 0.969, alpha: 1)`

Raw valuesPacked integers and plain arrays.

0x hex	`0xA855F7`
0x hex (ARGB)	`0xFFA855F7`
Array 0–1	`[0.659, 0.333, 0.969]`
Array 0–255	`[168, 85, 247]`
Decimal integer	`11032055`

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
Purple 500 on white	3.96:1	AA Large	Lc 66	Headings and large text
Purple 500 on black	5.31:1	AA	Lc 35	Non-text elements only

Purple 500 text on a white background

Purple 500 text on a black background

White text on Purple 500

Black text on Purple 500

Tonal scale

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

50#fdf2ff
100#f5e5ff
200#e9ceff
300#d9afff
400#c584ff
500#ab58fb
600#903dd9
700#7625b9
800#610d9c
900#4e0082
950#300056

Tints and shades

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

Tint 1#b676fb
Tint 2#c493fd
Tint 3#d2afff
Tint 4#e1caff
Tint 5#f0e5ff
Shade 1#8341c2
Shade 2#602e8f
Shade 3#3f1c60
Shade 4#200b34
Shade 5#06010e

Colours that work with Purple 500

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

#739800
#ca6d00
#00a191
#6372ff
#d53cc1

Closest CSS names

mediumorchidΔEok 0.065
mediumpurpleΔEok 0.078
mediumslateblueΔEok 0.081
darkorchidΔEok 0.091
bluevioletΔEok 0.095
darkvioletΔEok 0.118