Back to palettes

Palette

Graffiti Alley Hue

Muted blues and grays that capture the essence of concrete walls and street art in an urban alley.

neutralminimal5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Graffiti Alley Hue 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 Graffiti Alley Hue.

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

Data visualization

#4F5D75#818E9B#BCCCDC#E8EAEB#6C7A89

Palette guide

How to use Graffiti Alley Hue

Overview

The Graffiti Alley Hue palette offers a sophisticated take on urban aesthetics, featuring muted blues and grays that evoke concrete walls and subtle street art nuances. With shades like the deep #4F5D75, the versatile #818E9B, and the lighter #BCCCDC, this palette provides a cohesive and modern foundation. The near-white #E8EAEB offers a clean canvas, while #6C7A89 provides a balanced mid-tone. This collection is ideal for designers and developers seeking to create contemporary, understated, and professional designs that hint at an urban edge without being overtly loud.

Best used for

  • Corporate and tech branding
  • Architectural and interior design presentations
  • Modern web and mobile application UI
  • Minimalist print design
  • Urban-inspired product packaging
  • Professional portfolio websites

Suggested color roles

primary

Use #4F5D75 for primary backgrounds, headers, or strong graphical elements, providing depth and stability.

secondary

Employ #6C7A89 for secondary sections, navigation, or subtle dividers, maintaining a cohesive look.

accent

While not a typical 'accent' palette, use #818E9B for interactive states or subtle highlights to add visual interest.

background

The light #E8EAEB serves as an excellent clean background, offering great readability for darker text. For a darker background, #4F5D75 works well.

text

For dark text, use #4F5D75 or a standard charcoal on lighter backgrounds. For lighter text on dark backgrounds, #E8EAEB ensures clarity.

Accessibility notes

  • Ensure sufficient contrast between text and background, especially when using similar mid-tone grays.
  • Use #E8EAEB for text on darker shades like #4F5D75 for optimal readability.
  • Avoid using #BCCCDC for small text on #E8EAEB as contrast might be insufficient.
  • Test color combinations with accessibility checkers to meet WCAG guidelines for text contrast.

Recommended combinations

Urban Foundation

A strong base for professional websites or apps, offering excellent readability and a modern feel.

#4F5D75 · #E8EAEB · #6C7A89

Concrete Flow

Ideal for creating depth and hierarchy in layouts, such as section dividers or card elements.

#818E9B · #BCCCDC · #4F5D75

Subtle Depth

Perfect for minimalist designs where subtle variations in tone are used to define elements without harsh contrasts.

#E8EAEB · #6C7A89 · #BCCCDC

CSS variables

:root {
  --graffiti-alley-hue-1: #4F5D75;
  --graffiti-alley-hue-2: #818E9B;
  --graffiti-alley-hue-3: #BCCCDC;
  --graffiti-alley-hue-4: #E8EAEB;
  --graffiti-alley-hue-5: #6C7A89;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "graffiti-alley-hue": {
        1: "#4F5D75",
        2: "#818E9B",
        3: "#BCCCDC",
        4: "#E8EAEB",
        5: "#6C7A89",
      }
    }
  }
}

Related searches

muted urban color schememodern gray blue paletteconcrete inspired colorsminimalist city paletteneutral tech design colors

Palette colors

Hex values

Color 1#4F5D75
·
Color 2#818E9B
·
Color 3#BCCCDC
·
Color 4#E8EAEB
·
Color 5#6C7A89
·

Accessibility

Contrast checker

1
2
3
4
5
1
2:1Fail
4.1:1AA18
5.5:1AA
1.5:1Fail
2
2:1Fail
2:1Fail
2.8:1Fail
1.3:1Fail
3
4.1:1AA18
2:1Fail
1.4:1Fail
2.7:1Fail
4
5.5:1AA
2.8:1Fail
1.4:1Fail
3.6:1AA18
5
1.5:1Fail
1.3:1Fail
2.7:1Fail
3.6:1AA18

Similar palettes

More like Graffiti Alley Hue

View all neutral
City Concrete Grind
Concrete Garden Grey
Graffiti Wall Grind
Industrial Urban Grit
Metro Grid Serene
Muted Urban Concrete