Back to palettes

Palette

Concrete Urbanity Calm

Muted grays and silvers reflecting the sleek, modern aesthetic of contemporary urban architecture.

neutralminimal5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Concrete Urbanity Calm 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 Concrete Urbanity Calm.

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

Data visualization

#778899#A9A9A9#C0C0C0#DCDCDC#696969

Palette guide

How to use Concrete Urbanity Calm

Overview

The "Concrete Urbanity Calm" palette features muted grays and silvers, reflecting the sleek, modern aesthetic of contemporary urban architecture. It ranges from a deep #696969 to very light tones like #DCDCDC and #C0C0C0, with versatile mid-tones like #778899 and #A9A9A9. This collection is perfect for designers seeking a minimalist, cool, and sophisticated aesthetic. It excels in creating designs that convey strength, elegance, and a clean, uncluttered visual identity, making it ideal for high-tech, architectural, or urban-themed projects where clarity and understated elegance are paramount.

Best used for

  • Modern architectural firm websites
  • Luxury brand interfaces
  • Minimalist tech company branding
  • Urban planning visualizations
  • Corporate consulting services
  • High-end product packaging

Suggested color roles

primary

#778899 - A sturdy, cool grey that provides a sophisticated and reliable foundation for main content and brand identity.

secondary

#A9A9A9 - A versatile, lighter grey, excellent for supporting text, subtle backgrounds, or secondary UI elements, offering a clean look.

accent

#696969 - A deep, robust grey that provides a powerful, grounding accent for calls to action, important headings, or bold graphic elements.

background

#DCDCDC - The lightest shade, offering a crisp, expansive, and highly readable background for all content.

text

#696969 - This darkest grey ensures excellent contrast for all body text against lighter backgrounds like #DCDCDC or #C0C0C0, promoting optimal readability.

Accessibility notes

  • Ensure #696969 text on #DCDCDC or #C0C0C0 backgrounds meets WCAG AA contrast standards.
  • Avoid using #DCDCDC for small text on #C0C0C0 as contrast will be insufficient.
  • Lighter grays like #A9A9A9 should be used carefully for text on mid-tones like #778899 to maintain readability.
  • Always check contrast ratios for interactive elements, especially if using a lighter grey for a button on a similar background.

Recommended combinations

Sleek Foundation

Creates a strong, high-contrast visual hierarchy, ideal for headers, footers, or impactful sections.

#696969 · #778899 · #DCDCDC

Urban Flow

Provides a harmonious, soft feel for content blocks, navigation, or subtle background variations.

#A9A9A9 · #C0C0C0 · #778899

Minimal Clarity

Emphasizes a clean, airy aesthetic with dark text, suitable for body content and minimalist layouts.

#DCDCDC · #C0C0C0 · #696969

CSS variables

:root {
  --concrete-urbanity-calm-1: #778899;
  --concrete-urbanity-calm-2: #A9A9A9;
  --concrete-urbanity-calm-3: #C0C0C0;
  --concrete-urbanity-calm-4: #DCDCDC;
  --concrete-urbanity-calm-5: #696969;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "concrete-urbanity-calm": {
        1: "#778899",
        2: "#A9A9A9",
        3: "#C0C0C0",
        4: "#DCDCDC",
        5: "#696969",
      }
    }
  }
}

Related searches

modern grey silver paletteminimalist urban colorscool sophisticated designsleek concrete schemeneutral architectural branding

Palette colors

Hex values

Color 1#778899
·
Color 2#A9A9A9
·
Color 3#C0C0C0
·
Color 4#DCDCDC
·
Color 5#696969
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2:1Fail
2.7:1Fail
1.5:1Fail
2
1.5:1Fail
1.3:1Fail
1.7:1Fail
2.3:1Fail
3
2:1Fail
1.3:1Fail
1.3:1Fail
3:1AA18
4
2.7:1Fail
1.7:1Fail
1.3:1Fail
4:1AA18
5
1.5:1Fail
2.3:1Fail
3:1AA18
4:1AA18

Similar palettes

More like Concrete Urbanity Calm

View all neutral
Minimalist Concrete Echo
Silent Concrete Minimal
Urban Concrete Oasis
Concrete Jungle Bloom
Gallery Wall Azure
Gritty Urban Canvas