Armour

#74857f

Muted cool steel gray for secondary UI surfaces

Save
Share

About Armour

Armour is the gray that sits between things. It's darker than Crown of and , but it doesn't lean into warmth the way does. There's a slight green undertone here that keeps it from feeling brown or earthy, which means it reads as composed without being cold. It's the kind of color that works because it doesn't demand attention.

Reach for it in product dashboards, data tools, and admin interfaces where you need a surface that holds its ground but doesn't muscle in on what matters. Sidebar backgrounds, secondary panels, form containers, anywhere you're building layers and need something that sits quietly between your content and the white space. It plays better with muted accents and desaturated palettes than with anything bright. In healthcare apps and internal platforms, it feels intentional without feeling institutional.

Pair it with deep text and it reads solid. The trick is not overthinking it, it's darker than Crown of so it actually works as a secondary surface, but it's restrained enough that it won't fight for dominance like would. This is the gray you pick when you want the surface to disappear but not apologize for existing.

Gradient preview

See how this color looks in an animated mesh gradient.

Conversions

Click any value to copy.

Need this programmatically? Color API

Code snippets

Copy this color into your project.

Contrast checker

WCAG 2.1 contrast ratios. AA requires 4.5:1 for normal text, 3:1 for large. AAA requires 7:1 / 4.5:1.

On White #ffffff

Aa
3.89:1FailAA Large

On Gray 100 #f5f5f5

Aa
3.56:1FailAA Large

On Gray 900 #18181b

Aa
4.56:1AAAAA Large

On Black #000000

Aa
5.40:1AAAAA Large

Variations

Shades

Darker variations, created by mixing toward black.

Tints

Lighter variations, created by mixing toward white.

Tones

Muted variations, created by reducing saturation.

Hues

Hue rotations around the color wheel.

Temperatures

Warm and cool shifts of this color.

Color harmonies

Complementary
Analogous
Triadic
Split Complementary
Tetradic

Suggested palettes

Palettes built around this color.

4 colors
3 colors
4 colors
4 colors

Community palettes

Published palettes that include this color.

Similar colors

Create a gradient with Armour

Open the generator with this color pre-loaded.

Start creating