Back to palettes

Palette

Concrete Jungle Canopy

A study in urban greys, from dark asphalt to light building facades.

monochromeminimal5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Concrete Jungle Canopy 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 Jungle Canopy.

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

Data visualization

#5A5A5A#7B7B7B#9C9C9C#BDBDBD#DEDEDE

Palette guide

How to use Concrete Jungle Canopy

Overview

The "Concrete Jungle Canopy" palette is a refined study in urban grays, ranging from dark asphalt to light building facades. With a deep #5A5A5A, versatile mid-tones like #7B7B7B, #9C9C9C, and #BDBDBD, and a bright #DEDEDE, this monochromatic collection is perfect for designers seeking a minimalist, modern, and robust aesthetic. It excels in creating designs that convey strength, sophistication, 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

  • Urban infrastructure branding
  • Industrial design websites
  • Minimalist UI/UX for applications
  • Corporate branding for engineering firms
  • Modern art gallery interfaces
  • High-tech product showcases

Suggested color roles

primary

#7B7B7B - A balanced, versatile grey that serves as a strong yet understated foundation for primary content and branding.

secondary

#9C9C9C - A lighter, clean grey, ideal for supporting information, subtle backgrounds, or secondary UI elements, offering a soft presence.

accent

#5A5A5A - A deep, rich charcoal that can provide a powerful accent for calls to action, important headings, or strong graphic elements.

background

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

text

#5A5A5A - This darkest grey ensures excellent contrast for all body text against lighter backgrounds like #DEDEDE or #BDBDBD, promoting optimal readability.

Accessibility notes

  • Ensure #5A5A5A text on #DEDEDE or #BDBDBD backgrounds meets WCAG AA contrast standards.
  • Avoid using #DEDEDE for small text on #9C9C9C as contrast will be insufficient.
  • Lighter grays like #BDBDBD should be used carefully for text on mid-tones like #7B7B7B 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

Deep Urban

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

#5A5A5A · #7B7B7B · #DEDEDE

Clean Balance

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

#9C9C9C · #BDBDBD · #7B7B7B

Minimal Clarity

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

#DEDEDE · #BDBDBD · #5A5A5A

CSS variables

:root {
  --concrete-jungle-canopy-1: #5A5A5A;
  --concrete-jungle-canopy-2: #7B7B7B;
  --concrete-jungle-canopy-3: #9C9C9C;
  --concrete-jungle-canopy-4: #BDBDBD;
  --concrete-jungle-canopy-5: #DEDEDE;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "concrete-jungle-canopy": {
        1: "#5A5A5A",
        2: "#7B7B7B",
        3: "#9C9C9C",
        4: "#BDBDBD",
        5: "#DEDEDE",
      }
    }
  }
}

Related searches

industrial grey palettemonochromatic urban colorsminimalist grey designmodern concrete schemesleek neutral branding

Palette colors

Hex values

Color 1#5A5A5A
·
Color 2#7B7B7B
·
Color 3#9C9C9C
·
Color 4#BDBDBD
·
Color 5#DEDEDE
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.5:1Fail
3.7:1AA18
5.1:1AA
2
1.6:1Fail
1.5:1Fail
2.3:1Fail
3.1:1AA18
3
2.5:1Fail
1.5:1Fail
1.5:1Fail
2:1Fail
4
3.7:1AA18
2.3:1Fail
1.5:1Fail
1.4:1Fail
5
5.1:1AA
3.1:1AA18
2:1Fail
1.4:1Fail

Similar palettes

More like Concrete Jungle Canopy

View all monochrome
Grayscale Metropolis Grid
Urban Alley Glow
Urban Steel Fog
Concrete Bloom Grey
Concrete Jungle Bloom
Concrete Jungle Haze