Back to palettes

Palette

Cityscape Window Glint

Grays and silvers reflecting the stark, modern elegance of a city skyline at sunset.

NeutralMinimal5 colors
More Neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cityscape Window Glint 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 Cityscape Window Glint.

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

Data visualization

#424242#616161#BDBDBD#E0E0E0#FFFFFF

Palette guide

How to use Cityscape Window Glint

Overview

The "Cityscape Window Glint" palette captures the stark, modern elegance of a city skyline, reflecting light off glass and steel. This sophisticated grayscale ranges from a deep, anchoring charcoal #424242 to a pure, crisp white #FFFFFF. Intermediate shades like #616161, #BDBDBD, and #E0E0E0 provide a smooth, subtle gradient, making it ideal for creating clean, professional, and minimalist designs. Designers and developers can leverage this palette for high-tech interfaces, corporate branding, or any project requiring a precise, modern, and understated elegance that conveys clarity and sophistication.

Best used for

  • Minimalist UI/UX design
  • Architectural firm websites
  • Tech company branding
  • Photography portfolios
  • Luxury product showcases
  • Editorial layouts

Suggested color roles

primary

#424242 - A strong, deep charcoal, ideal for foundational elements, headers, or robust typography.

secondary

#616161 - A versatile medium gray, perfect for secondary panels, navigation, or subtle dividers.

accent

#BDBDBD - A balanced light gray, suitable for interactive elements, borders, or subtle highlights.

background

#FFFFFF - A pure, bright white, providing a clean, expansive, and reflective canvas for content.

text

#424242 - For highly readable body text on light backgrounds, or a crisp white for headers on dark elements.

Accessibility notes

  • Ensure sufficient contrast when using lighter shades like #E0E0E0 or #FFFFFF for text on similar light backgrounds; best for accents.
  • Darker colors like #424242 and #616161 provide excellent contrast for white text, enhancing readability.
  • Avoid using very light grays for small or thin text on white, as they may become illegible for some users.
  • Utilize clear visual cues beyond color, such as underlines for links or bolding for emphasis, especially across the lighter shades.

Recommended combinations

Modern Contrast

Ideal for clean, high-contrast layouts, with dark text on a bright white background.

#424242 · #616161 · #FFFFFF

Subtle Reflection

Excellent for soft backgrounds, hover states, or to add slight dimensionality to elements without harsh contrast.

#E0E0E0 · #BDBDBD · #616161

Architectural Shine

A balanced trio for clean website layouts, combining a bright base with a mid-tone accent and dark text.

#FFFFFF · #BDBDBD · #424242

CSS variables

:root {
  --cityscape-window-glint-1: #424242;
  --cityscape-window-glint-2: #616161;
  --cityscape-window-glint-3: #BDBDBD;
  --cityscape-window-glint-4: #E0E0E0;
  --cityscape-window-glint-5: #FFFFFF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cityscape-window-glint": {
        1: "#424242",
        2: "#616161",
        3: "#BDBDBD",
        4: "#E0E0E0",
        5: "#FFFFFF",
      }
    }
  }
}

Related searches

grayscale city palettemodern minimalist colorsmonochrome UI designtech UI paletteclean architecture colors

Palette colors

Hex values

Color 1#424242
·
Color 2#616161
·
Color 3#BDBDBD
·
Color 4#E0E0E0
·
Color 5#FFFFFF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
5.3:1AA
7.6:1AAA
10:1AAA
2
1.6:1Fail
3.3:1AA18
4.7:1AA
6.2:1AA
3
5.3:1AA
3.3:1AA18
1.4:1Fail
1.9:1Fail
4
7.6:1AAA
4.7:1AA
1.4:1Fail
1.3:1Fail
5
10:1AAA
6.2:1AA
1.9:1Fail
1.3:1Fail

Similar palettes

More like Cityscape Window Glint

View all Neutral