Back to palettes

Palette

Urban Grid Dawn

Cool greys and subtle blues mirroring the crisp lines of a city skyline at the first hint of morning light.

coolminimal5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Urban Grid Dawn 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 Urban Grid Dawn.

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

Data visualization

#D3D3D3#A9A9A9#696969#2F4F4F#4682B4

Palette guide

How to use Urban Grid Dawn

Overview

The Urban Grid Dawn palette combines cool greys and subtle blues, mirroring the crisp lines of a city skyline at the first hint of morning light. Featuring #D3D3D3 and #A9A9A9 for lighter tones, it deepens into #696969 and #2F4F4F, with a distinctive #4682B4 (Steel Blue) providing a cool accent. This palette is perfect for designers and developers aiming for a fresh, modern, and clean aesthetic. It excels in creating interfaces and branding that evoke professionalism and tranquility, ideal for projects demanding a sophisticated yet approachable visual identity, reminiscent of a peaceful urban awakening.

Best used for

  • Tech startup branding
  • Modern architectural websites
  • Clean user interface designs
  • Environmental or sustainability projects
  • Corporate communication materials
  • Mobile application themes

Suggested color roles

primary

Use #2F4F4F (Dark Slate Gray) for dominant elements, headers, or strong branding to establish a deep, cool, and authoritative base.

secondary

Apply #696969 (Dim Gray) for supporting content blocks, navigation, or dividers, offering a softer contrast to the primary.

accent

Employ #4682B4 (Steel Blue) as a vibrant, yet sophisticated, accent for interactive elements, calls-to-action, or key data points.

background

Utilize #D3D3D3 (Light Gray) as a clean, bright background for main content areas, ensuring excellent readability for darker text.

text

For primary text on light backgrounds, #2F4F4F provides excellent contrast. For secondary text, #696969 works well. On dark backgrounds, use #D3D3D3.

Accessibility notes

  • Ensure #2F4F4F text on #D3D3D3 background meets WCAG AA contrast for body text.
  • The #4682B4 accent must have sufficient contrast when used for text or interactive elements.
  • Be cautious with #A9A9A9 text on #696969 backgrounds; test contrast thoroughly for small text.
  • Maintain clear visual hierarchy by varying shades appropriately to distinguish interactive elements.

Recommended combinations

Cool Contrast

A strong cool base with a vibrant accent and light background, ideal for calls-to-action.

#2F4F4F · #4682B4 · #D3D3D3

Morning Haze

Creates a soft, layered effect for UI components or background textures, reminiscent of dawn light.

#696969 · #A9A9A9 · #D3D3D3

Urban Fresh

Combines deep gray with a mid-tone and a striking blue for a modern, energetic feel.

#2F4F4F · #A9A9A9 · #4682B4

CSS variables

:root {
  --urban-grid-dawn-1: #D3D3D3;
  --urban-grid-dawn-2: #A9A9A9;
  --urban-grid-dawn-3: #696969;
  --urban-grid-dawn-4: #2F4F4F;
  --urban-grid-dawn-5: #4682B4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "urban-grid-dawn": {
        1: "#D3D3D3",
        2: "#A9A9A9",
        3: "#696969",
        4: "#2F4F4F",
        5: "#4682B4",
      }
    }
  }
}

Related searches

cool gray blue palettecity skyline colorsmodern concrete schemedawn light color palettesteel blue gray design

Palette colors

Hex values

Color 1#D3D3D3
·
Color 2#A9A9A9
·
Color 3#696969
·
Color 4#2F4F4F
·
Color 5#4682B4
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
3.7:1AA18
6:1AA
2.7:1Fail
2
1.6:1Fail
2.3:1Fail
3.8:1AA18
1.7:1Fail
3
3.7:1AA18
2.3:1Fail
1.6:1Fail
1.3:1Fail
4
6:1AA
3.8:1AA18
1.6:1Fail
2.2:1Fail
5
2.7:1Fail
1.7:1Fail
1.3:1Fail
2.2:1Fail

Similar palettes

More like Urban Grid Dawn

View all cool
Urban Rain Puddle
Urban Steel Echo
Urban Teal Grunge
Digital Rainstorm
Industrial Edge Steel
Metropolitan Dusk