Colour reference

Deep Navy

#1d3557

RGB: rgb(29 53 87)
HSL: 215°, 50%, 23%
OKLCh: 32.8% 0.068 257.3

Deep Navy in every format

Web & CSSThe everyday formats for stylesheets and design tools.

Hex	`#1d3557`
RGB	`rgb(29 53 87)`
RGB legacy	`rgb(29, 53, 87)`
RGB percent	`rgb(11.37% 20.78% 34.12%)`
HSL	`hsl(215.2 50% 22.7%)`
HSL legacy	`hsl(215.2, 50%, 22.7%)`
HSV / HSB	`hsv(215.2, 66.7%, 34.1%)`
HWB	`hwb(215.2 11.4% 65.9%)`
Nearest name	`midnightblue (approx.)`
CMYK	`cmyk(66.7%, 39.1%, 0%, 65.9%)`Naive conversion. Real print work needs an ICC profile.

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

OKLCh	`oklch(32.764% 0.0678 257.272)`Modern CSS colour space for even palettes — better than HSL when building scales.
OKLab	`oklab(32.764% -0.01494 -0.06613)`
CIE LCh	`lch(21.592% 23.768 269.555)`
CIE Lab	`lab(21.592% -0.185 -23.767)`
Display P3	`color(display-p3 0.1354 0.2054 0.3311)`
Rec. 2020	`color(rec2020 0.1042 0.1429 0.2702)`
srgb-linear	`color(srgb-linear 0.0123 0.0356 0.0953)`Light-linear sRGB — the same numbers a shader wants for maths.
CIE XYZ (D65)	`color(xyz-d65 0.035 0.035 0.0951)`

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

GLSL vec3 — sRGB	`vec3(0.114, 0.208, 0.341)`Encoded values. Use when writing straight to the framebuffer.
GLSL vec3 — linear	`vec3(0.012, 0.036, 0.095)`Light-linear values. Use for lighting, blending and mixing.
GLSL vec4 — sRGB	`vec4(0.114, 0.208, 0.341, 1.0)`
GLSL vec4 — linear	`vec4(0.012, 0.036, 0.095, 1.0)`
GLSL ivec3	`ivec3(29, 53, 87)`
HLSL float3 — sRGB	`float3(0.114, 0.208, 0.341)`
HLSL float3 — linear	`float3(0.012, 0.036, 0.095)`
HLSL float4 — sRGB	`float4(0.114, 0.208, 0.341, 1.0)`
HLSL half4 — sRGB	`half4(0.114, 0.208, 0.341, 1.0)`
WGSL vec3f — sRGB	`vec3f(0.114, 0.208, 0.341)`
WGSL vec4f — sRGB	`vec4f(0.114, 0.208, 0.341, 1.0)`
WGSL vec3<f32> — linear	`vec3<f32>(0.012, 0.036, 0.095)`

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

Unity Color	`new Color(0.114f, 0.208f, 0.341f, 1.0f)`Color for everyday scripting (0–1). Color32 when you need whole numbers from 0 to 255.
Unity Color32	`new Color32(29, 53, 87, 255)`
Unreal FLinearColor	`FLinearColor(0.0123f, 0.0356f, 0.0953f, 1.0f)`FLinearColor for materials and lighting. FColor when you need whole numbers from 0 to 255.
Unreal FColor	`FColor(29, 53, 87, 255)`Whole numbers from 0 to 255 — use when an API asks for FColor, not FLinearColor.
Godot Color	`Color(0.114, 0.208, 0.341, 1)`
Flutter Color	`Color(0xFF1D3557)`Packed ARGB, so alpha comes first.
Android Color	`Color.rgb(29, 53, 87)`
SwiftUI Color	`Color(red: 0.114, green: 0.208, blue: 0.341)`
UIKit UIColor	`UIColor(red: 0.114, green: 0.208, blue: 0.341, alpha: 1)`

Raw valuesPacked integers and plain arrays.

0x hex	`0x1D3557`
0x hex (ARGB)	`0xFF1D3557`
Array 0–1	`[0.114, 0.208, 0.341]`
Array 0–255	`[29, 53, 87]`
Decimal integer	`1914199`

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
Deep Navy on white	12.36:1	AAA	Lc 98	Body text at any size
Deep Navy on black	1.70:1	Fail	Lc 0	Not usable for text

Deep Navy text on a white background

Deep Navy text on a black background

White text on Deep Navy

Black text on Deep Navy

Tonal scale

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

50#eaf9ff
100#daefff
200#c5deff
300#adc8ee
400#8fabd3
500#718db5
600#597398
700#445c7e
800#334967
900#263954
950#112035

Tints and shades

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

Tint 1#3e5372
Tint 2#61738d
Tint 3#8695a9
Tint 4#adb7c5
Tint 5#d5dae2
Shade 1#142742
Shade 2#0c1a2f
Shade 3#050e1c
Shade 4#01040c
Shade 5#000101

Colours that work with Deep Navy

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

#482f01
#522528
#233d18
#003b50
#332e55

Closest CSS names

midnightblueΔEok 0.090
darkslategrayΔEok 0.096
darkslateblueΔEok 0.113
navyΔEok 0.133
darkblueΔEok 0.138
indigoΔEok 0.140