Runway Neutrals

Camel, cream and espresso — a timeless capsule wardrobe.

≈ Alabaster
≈ Oatmeal
≈ Driftwood
≈ Bark
≈ Licorice

Color codes

HEXRGBHSLCMYK
hsl(39, 35%, 92%)cmyk(0%, 2%, 6%, 5%)
hsl(36, 34%, 77%)cmyk(0%, 7%, 19%, 15%)
hsl(35, 27%, 52%)cmyk(0%, 17%, 40%, 35%)
hsl(26, 22%, 30%)cmyk(0%, 20%, 36%, 63%)
hsl(23, 15%, 11%)cmyk(0%, 16%, 26%, 88%)

CSS

:root {
  --runway-neutrals-1: #F2EDE4;
  --runway-neutrals-2: #D8C8B0;
  --runway-neutrals-3: #A68A64;
  --runway-neutrals-4: #5E4B3C;
  --runway-neutrals-5: #1F1A17;
}

How these colors work together

This is a monochromatic palette built around a single hue. Overall it reads warm. Lightness spans 82 points, which sets how much contrast you can create.

5 of 10 color pairs reach the 4.5:1 contrast needed for normal text. The most readable pair is ⁦#F2EDE4⁩ on ⁦#1F1A17⁩ (14.78:1).

Runway Neutrals — readable text using the best pair.

Suggested applications

  • Lookbooks, collections and retail displays.
  • Interface themes: use the lightest color for backgrounds and the darkest for text.
  • Brand kits, social graphics and presentations.

#camel#capsule#neutral

Check accessibility Simulate color blindness CSS variables

Frequently asked questions

How do I use the Runway Neutrals palette?
The Runway Neutrals palette has 5 colors. Use one dominant color for large areas, a supporting color for secondary elements and the most saturated color sparingly as an accent.
Which colors in this palette are best for text?
Use ⁦#F2EDE4⁩ on ⁦#1F1A17⁩: it has a contrast ratio of 14.78:1.
Can I download this palette?
Yes. Export it as PNG, SVG, CSS variables, JSON or plain text with the buttons above the color table.

More palettes