Back to palettes

Palette

Industrial Chic Loft

Captures the stark, sophisticated essence of modern industrial design with raw textures.

neutralminimal5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Industrial Chic Loft 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 Industrial Chic Loft.

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

Data visualization

#2B2F3A#4C586F#78859F#D3DADE#AA774C

Palette guide

How to use Industrial Chic Loft

Overview

The Industrial Chic Loft palette captures the stark, sophisticated essence of modern industrial design with raw textures, blending cool greys and a warm accent. From the deep #2B2F3A to the light #D3DADE, this palette is anchored by versatile blues-greys like #4C586F and #78859F, brilliantly accented by the rich #AA774C. This combination provides designers and developers with a powerful tool to create urban, modern, and minimal digital experiences. It's ideal for branding that conveys strength, elegance, and authenticity, reflecting the aesthetic of a refined industrial loft space.

Best used for

  • Architectural firm websites and portfolios
  • Interior design blogs and e-commerce
  • High-end furniture and decor brands
  • Tech product launches and landing pages
  • Urban development and real estate projects
  • Design agencies with a modern aesthetic

Suggested color roles

primary

Utilize #2B2F3A as a deep, commanding base color for hero sections, strong headers, or as a dominant brand element.

secondary

Apply #4C586F for supporting dark elements, strong body text, or navigation bars, providing depth and structure.

accent

Highlight interactive elements, calls to action, or key information with #AA774C, offering a warm and inviting focal point.

background

Employ #D3DADE as a light, neutral, and spacious canvas, evoking concrete textures and enhancing content readability.

text

For optimal readability on lighter backgrounds, use #2B2F3A or a dark charcoal. On darker backgrounds, white or a light grey is recommended.

Accessibility notes

  • Ensure sufficient contrast for text, especially when using #AA774C on #D3DADE for interactive elements or important information.
  • Prioritize using #2B2F3A for body text on light backgrounds to meet accessibility standards.
  • Check contrast ratios for all color combinations, especially for smaller text or icons.
  • Avoid using #78859F for small text on #D3DADE, as it may lack sufficient contrast.

Recommended combinations

Urban Contrast

Ideal for a stark, modern interface: #D3DADE as the background, #2B2F3A for strong text/elements, and #AA774C for a warm, inviting accent.

#2B2F3A · #D3DADE · #AA774C

Concrete & Copper

Excellent for layered UI elements, data visualizations, or sections where #AA774C provides a metallic or industrial accent.

#4C586F · #78859F · #AA774C

Loft Elements

Use #D3DADE as a clean base, #2B2F3A for primary text and headers, and #78859F for subtle dividers or secondary information panels.

#D3DADE · #2B2F3A · #78859F

CSS variables

:root {
  --industrial-chic-loft-1: #2B2F3A;
  --industrial-chic-loft-2: #4C586F;
  --industrial-chic-loft-3: #78859F;
  --industrial-chic-loft-4: #D3DADE;
  --industrial-chic-loft-5: #AA774C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "industrial-chic-loft": {
        1: "#2B2F3A",
        2: "#4C586F",
        3: "#78859F",
        4: "#D3DADE",
        5: "#AA774C",
      }
    }
  }
}

Related searches

industrial loft colorsmodern urban paletteconcrete and metal schemechic grey and brownarchitectural design colors

Palette colors

Hex values

Color 1#2B2F3A
·
Color 2#4C586F
·
Color 3#78859F
·
Color 4#D3DADE
·
Color 5#AA774C
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
3.6:1AA18
9.5:1AAA
3.5:1AA18
2
1.9:1Fail
1.9:1Fail
5.1:1AA
1.9:1Fail
3
3.6:1AA18
1.9:1Fail
2.6:1Fail
1:1Fail
4
9.5:1AAA
5.1:1AA
2.6:1Fail
2.7:1Fail
5
3.5:1AA18
1.9:1Fail
1:1Fail
2.7:1Fail

Similar palettes

More like Industrial Chic Loft

View all neutral
Urban Loft Concrete
Concrete Garden Grey
Concrete Grid Lines
Concrete Jungle Bloom
Concrete Loft Living
Industrial Loft Concrete