Back to palettes

Palette

Urban Winter Chill

A sleek, cool palette inspired by the stark, glittering lights of a winter cityscape under a frosty grey sky.

monochromeminimal5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Urban Winter Chill 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 Winter Chill.

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

Data visualization

#303030#505050#707070#909090#b0b0b0

Palette guide

How to use Urban Winter Chill

Overview

The "Urban Winter Chill" palette is a sleek, monochrome collection of cool grays, perfectly capturing the stark elegance of a winter cityscape. Ranging from a deep charcoal #303030 to a soft, almost ethereal light gray #b0b0b0, it offers a sophisticated gradient of tones. The mid-range grays, including #505050, #707070, and #909090, provide versatility for layering and depth. This palette is ideal for designs that aim for a minimalist, modern, and professional aesthetic, evoking the crispness of frosty mornings and the subtle gleam of city lights against a muted sky, without being overly cold for designers and developers.

Best used for

  • High-tech product branding (sleek, minimalist)
  • Photography portfolios (monochrome, urban)
  • Professional service websites (finance, legal)
  • Dark mode UI themes
  • Architectural blueprints and renders
  • Winter fashion or luxury goods

Suggested color roles

primary

Use #303030 as a deep, foundational background or for strong headings to convey sophistication.

secondary

Apply #505050 to supporting elements, large text on lighter backgrounds, or UI components.

accent

Utilize #909090 for subtle highlights, dividers, inactive states, or delicate graphic elements.

background

Employ #b0b0b0 as a light, clean content area for readability, creating an airy feel.

text

Use #707070 for readable body text on lighter backgrounds, or a crisp white for text on darker shades like #303030.

Accessibility notes

  • #707070 on #b0b0b0 has acceptable contrast for body text, but always verify for smaller sizes.
  • White or very light gray text on #303030 and #505050 provides excellent readability.
  • Avoid using #909090 for critical text on #b0b0b0 due to potential low contrast.
  • Ensure interactive elements have sufficient contrast from their surrounding background for usability.

Recommended combinations

Frosty Depth

Strong dark base with clean, bright contrasting elements, ideal for modern interfaces.

#303030 · #505050 · #B0B0B0

Gradient Chill

Smooth, atmospheric gradients for backgrounds or visual depth, evoking a subtle mood.

#505050 · #707070 · #909090

Clean Contrast

Light, minimalist layout with clear, darker text and a strong anchor for readability.

#B0B0B0 · #707070 · #303030

CSS variables

:root {
  --urban-winter-chill-1: #303030;
  --urban-winter-chill-2: #505050;
  --urban-winter-chill-3: #707070;
  --urban-winter-chill-4: #909090;
  --urban-winter-chill-5: #b0b0b0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "urban-winter-chill": {
        1: "#303030",
        2: "#505050",
        3: "#707070",
        4: "#909090",
        5: "#b0b0b0",
      }
    }
  }
}

Related searches

monochrome grey palettewinter city colorsminimalist dark grey schemesleek urban designprofessional grey tones

Palette colors

Hex values

Color 1#303030
·
Color 2#505050
·
Color 3#707070
·
Color 4#909090
·
Color 5#b0b0b0
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.7:1Fail
4.1:1AA18
6.1:1AA
2
1.6:1Fail
1.6:1Fail
2.5:1Fail
3.7:1AA18
3
2.7:1Fail
1.6:1Fail
1.6:1Fail
2.3:1Fail
4
4.1:1AA18
2.5:1Fail
1.6:1Fail
1.5:1Fail
5
6.1:1AA
3.7:1AA18
2.3:1Fail
1.5:1Fail

Similar palettes

More like Urban Winter Chill

View all monochrome