Back to palettes

Palette

Urban Cement Edge

A stark, modern grayscale reflecting the clean lines and solid feel of urban cement structures.

monochromeminimal5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Urban Cement Edge 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 Cement Edge.

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

Data visualization

#2B2B2B#4A4A4A#6E6E6E#929292#B5B5B5

Palette guide

How to use Urban Cement Edge

Overview

The "Urban Cement Edge" palette embodies a stark, modern grayscale, perfectly reflecting the clean lines and solid feel of urban cement structures. This monochromatic scheme ranges from the deep, anchoring #2B2B2B (Jet Black) through #4A4A4A (Dark Gray), #6E6E6E (Gray), and #929292 (Medium Gray), culminating in the crisp #B5B5B5 (Light Gray). It's an ideal choice for designers seeking to create impactful, minimalist, and highly professional designs that emphasize structure, clarity, and sophistication. This palette is incredibly versatile for any project requiring a strong, no-nonsense aesthetic, from corporate branding to high-tech interfaces.

Best used for

  • High-tech and software company branding
  • Minimalist website and app interfaces
  • Architectural photography portfolios
  • Professional corporate reports and presentations
  • Luxury goods e-commerce platforms
  • Industrial design concept visualizations

Suggested color roles

primary

#2B2B2B (Jet Black) - The ultimate grounding color for main headers, critical text, and bold structural elements, conveying strength and authority.

secondary

#4A4A4A (Dark Gray) - Excellent for subheadings, navigation, or prominent content sections, offering a slightly softer yet equally strong presence.

accent

#6E6E6E (Gray) - Use for interactive elements, borders, or subtle highlights that need to stand out without disrupting the monochrome harmony.

background

#B5B5B5 (Light Gray) - A clean, neutral background that provides excellent contrast for darker text and maintains a light, open feel.

text

#2B2B2B (Jet Black) for primary text on lighter backgrounds, or a crisp white like #FFFFFF for light text on #2B2B2B, #4A4A4A, or #6E6E6E.

Accessibility notes

  • Ensure strong contrast between all text and background pairings, especially #929292 on #B5B5B5.
  • #2B2B2B on #B5B5B5 offers excellent readability for body text and headings.
  • Avoid using #929292 for small text on a #B5B5B5 background due to low contrast.
  • Use the darkest shades for critical information and interactive elements.

Recommended combinations

Stark Contrast

Ideal for primary text and background, with a mid-tone for dividers or secondary information, creating powerful visual impact.

#2B2B2B · #B5B5B5 · #4A4A4A

Layered Depth

Create subtle depth and hierarchy in UI elements, such as cards or panels, through tonal variation.

#4A4A4A · #6E6E6E · #929292

Clean Interaction

Use for button states, active navigation links, or progress bars, ensuring clear visual feedback within a monochrome scheme.

#2B2B2B · #6E6E6E · #B5B5B5

CSS variables

:root {
  --urban-cement-edge-1: #2B2B2B;
  --urban-cement-edge-2: #4A4A4A;
  --urban-cement-edge-3: #6E6E6E;
  --urban-cement-edge-4: #929292;
  --urban-cement-edge-5: #B5B5B5;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "urban-cement-edge": {
        1: "#2B2B2B",
        2: "#4A4A4A",
        3: "#6E6E6E",
        4: "#929292",
        5: "#B5B5B5",
      }
    }
  }
}

Related searches

monochromatic grey palettemodern grayscale designminimalist black and whiteurban concrete colorsprofessional grey branding

Palette colors

Hex values

Color 1#2B2B2B
·
Color 2#4A4A4A
·
Color 3#6E6E6E
·
Color 4#929292
·
Color 5#B5B5B5
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.8:1Fail
4.6:1AA
6.9:1AA
2
1.6:1Fail
1.7:1Fail
2.8:1Fail
4.3:1AA18
3
2.8:1Fail
1.7:1Fail
1.6:1Fail
2.5:1Fail
4
4.6:1AA
2.8:1Fail
1.6:1Fail
1.5:1Fail
5
6.9:1AA
4.3:1AA18
2.5:1Fail
1.5:1Fail

Similar palettes

More like Urban Cement Edge

View all monochrome
Urban Graphite Canvas
Urban Grid Minimal
City Loft Minimal
City Steel Gleam
Concrete Bloom Grey
Concrete Jungle Bloom