ع

Denim Days

Washed, mid and raw denim blues.

≈ Marble White
≈ Sky Mist
≈ Blue Gray
≈ Cobalt Blue
≈ Midnight Slate

Color codes

HEXRGBHSLCMYK
hsl(60, 10%, 94%)cmyk(0%, 0%, 1%, 5%)
hsl(213, 28%, 83%)cmyk(11%, 6%, 0%, 12%)
hsl(215, 39%, 59%)cmyk(43%, 26%, 0%, 25%)
hsl(216, 46%, 34%)cmyk(63%, 38%, 0%, 50%)
hsl(224, 37%, 16%)cmyk(54%, 39%, 0%, 78%)

CSS

:root {
  --denim-days-1: #F1F1EE;
  --denim-days-2: #C8D3E0;
  --denim-days-3: #6C8EBF;
  --denim-days-4: #2F4F7F;
  --denim-days-5: #1A2238;
}

How these colors work together

This is a monochromatic palette built around a single hue. Overall it reads cool. Lightness spans 78 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 ⁦#F1F1EE⁩ on ⁦#1A2238⁩ (13.95:1).

Denim Days — 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.

#denim#blue#casual

Check accessibility Simulate color blindness CSS variables

Frequently asked questions

How do I use the Denim Days palette?
The Denim Days 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 ⁦#F1F1EE⁩ on ⁦#1A2238⁩: it has a contrast ratio of 13.95: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

Terracotta Season#F3E3D3 #E2A07A #C96A45 #8E3B2A #3F2A22Runway Neutrals#F2EDE4 #D8C8B0 #A68A64 #5E4B3C #1F1A17Color Block#FF006E #FB5607 #FFBE0B #3A86FF #8338ECLavender Fields#F3EEFC #E0D4F7 #C3B1E1 #9D8EC7 #6A5D8FSeventies Living#6B4226 #D4A017 #E07B39 #8A9A5B #F2E3C6Silver Morning#F7F9FB #E1E6EB #B8C2CC #7A8794 #3E4A56