Back to palettes

Palette

Prairie Dusk

Captures the quiet, expansive beauty of open plains fading into the subtle colors of twilight.

neutralcalm5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Prairie Dusk reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Prairie Dusk.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#607D8B#78909C#90A4AE#B0BEC5#455A64

Palette guide

How to use Prairie Dusk

Overview

The Prairie Dusk palette captures the quiet, expansive beauty of open plains at twilight, offering a sophisticated range of cool grays and muted blues. This serene collection moves from the deep, grounding #455A64, through the balanced #607D8B and #78909C, to the lighter, airy #90A4AE and #B0BEC5. These neutral tones are ideal for creating designs that exude calm, professionalism, and understated elegance. Designers can leverage this palette for corporate branding, refined web interfaces, or content that requires a sense of stability, modernity, and quiet contemplation in both digital and print media.

Best used for

  • Corporate branding and professional websites
  • Modern architectural design presentations
  • Minimalist UI/UX design
  • Serene photography portfolios
  • Environmental or nature-focused organizations
  • High-tech product packaging

Suggested color roles

primary

#607D8B - A versatile medium blue-gray, excellent for main content areas, headers, or a primary brand color.

secondary

#78909C - A slightly lighter blue-gray that complements the primary, suitable for secondary information, subheadings, or backgrounds.

accent

#455A64 - A deep, rich blue-gray that provides a strong, grounding accent for call-to-action buttons, important icons, or impactful text.

background

#B0BEC5 - A very light, airy blue-gray, offering a clean, subtle backdrop that allows other colors to stand out without harshness.

text

#455A64 - The darkest shade in the palette, perfect for body text on lighter backgrounds like #B0BEC5 or #90A4AE, ensuring excellent readability.

Accessibility notes

  • #455A64 text on #B0BEC5 background offers excellent WCAG AA and AAA contrast.
  • Ensure sufficient contrast when using lighter grays for text, particularly #90A4AE or #B0BEC5, which should be avoided for small text.
  • #607D8B and #78909C provide good contrast for headings and larger text on #B0BEC5.
  • Maintain clear visual hierarchy using color and weight, especially with a monochromatic palette.

Recommended combinations

Twilight Sky

Creates a gentle, expansive gradient, perfect for backgrounds, headers, or subtle graphical elements.

#B0BEC5 · #90A4AE · #607D8B

Grounded Calm

Provides strong contrast and stability. #455A64 for key elements, #607D8B for main content, #B0BEC5 for the base.

#455A64 · #607D8B · #B0BEC5

Subtle Depth

A sophisticated blend. #78909C for primary, #90A4AE for secondary, and #455A64 for impactful, dark accents.

#78909C · #90A4AE · #455A64

CSS variables

:root {
  --prairie-dusk-1: #607D8B;
  --prairie-dusk-2: #78909C;
  --prairie-dusk-3: #90A4AE;
  --prairie-dusk-4: #B0BEC5;
  --prairie-dusk-5: #455A64;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "prairie-dusk": {
        1: "#607D8B",
        2: "#78909C",
        3: "#90A4AE",
        4: "#B0BEC5",
        5: "#455A64",
      }
    }
  }
}

Related searches

cool gray color palettemuted blue gray schememodern neutral colorstwilight inspired paletteexpansive calm colors

Palette colors

Hex values

Color 1#607D8B
·
Color 2#78909C
·
Color 3#90A4AE
·
Color 4#B0BEC5
·
Color 5#455A64
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.7:1Fail
2.3:1Fail
1.7:1Fail
2
1.3:1Fail
1.3:1Fail
1.8:1Fail
2.2:1Fail
3
1.7:1Fail
1.3:1Fail
1.4:1Fail
2.8:1Fail
4
2.3:1Fail
1.8:1Fail
1.4:1Fail
3.8:1AA18
5
1.7:1Fail
2.2:1Fail
2.8:1Fail
3.8:1AA18

Similar palettes

More like Prairie Dusk

View all neutral
Cloud Forest Mist
Coastal Driftwood Grey
Coastal Pebble Beach
Coastal Seagrass Sway
Gentle River Stones
Highlands Fog Hike