Back to palettes

Palette

Acid Rain Gloom

Muted, somber greys and blues reflecting the heavy, industrial atmosphere of an acid rain day.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Acid Rain Gloom 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 Acid Rain Gloom.

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

Data visualization

#6B7B8E#8C9CAB#AFC1D1#3C4752#293038

Palette guide

How to use Acid Rain Gloom

Overview

The Acid Rain Gloom palette captures the somber, industrial atmosphere of a moody urban landscape, blending cool greys and blues. This collection, ranging from the deep #293038 to the lighter #AFC1D1, is perfect for designs aiming for a serious, modern, or minimalist aesthetic with an edge. The mid-tones like #6B7B8E and #8C9CAB provide excellent versatility for creating subtle gradients or defining distinct UI elements without harsh contrasts. Designers and developers will find this palette ideal for tech startups, conceptual art, or any project that benefits from a cool, understated, and slightly melancholic vibe, ensuring a sophisticated and intriguing user experience.

Best used for

  • Urban exploration photography websites
  • Modern tech and software interfaces
  • Conceptual art and graphic design projects
  • Industrial design branding
  • Dark, moody video game aesthetics
  • Minimalist fashion or lifestyle brands

Suggested color roles

primary

Use #293038 as the foundational deep background, providing a strong, somber base for the design.

secondary

Apply #3C4752 or #6B7B8E for content blocks, navigation, or card backgrounds, offering clear differentiation.

accent

Introduce #AFC1D1 as a subtle, lighter accent for interactive elements, key data points, or a touch of visual relief.

background

The darkest #293038 or #3C4752 offers a deep, atmospheric background, while #6B7B8E provides a mid-tone base.

text

For dark backgrounds, a crisp white or very light grey text (e.g., #F0F0F0) is recommended. On lighter shades like #AFC1D1, use #293038 for clear readability.

Accessibility notes

  • Ensure strong contrast for text on dark shades like #293038 and #3C4752; light text is crucial for readability.
  • When pairing mid-tones like #6B7B8E and #8C9CAB, verify text contrast carefully, especially for smaller fonts.
  • The lightest color, #AFC1D1, offers good contrast with the darkest #293038 for highlighting important information.
  • Use sufficient line height and clear typography to enhance readability within this cool, muted scheme.

Recommended combinations

Urban Depth

Creates a layered, atmospheric effect for UI elements or background gradients, moving from deep dark to a softer grey-blue.

#293038 · #3C4752 · #6B7B8E

Gloom Contrast

Pairs a dark background with a light accent and crisp white text for clear information hierarchy and visual interest.

#3C4752 · #AFC1D1 · #8C9CAB

Misty Horizon

Ideal for creating soft, atmospheric backgrounds or subtle transitions, evoking a misty, cool environment.

#6B7B8E · #8C9CAB · #AFC1D1

CSS variables

:root {
  --acid-rain-gloom-1: #6B7B8E;
  --acid-rain-gloom-2: #8C9CAB;
  --acid-rain-gloom-3: #AFC1D1;
  --acid-rain-gloom-4: #3C4752;
  --acid-rain-gloom-5: #293038;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "acid-rain-gloom": {
        1: "#6B7B8E",
        2: "#8C9CAB",
        3: "#AFC1D1",
        4: "#3C4752",
        5: "#293038",
      }
    }
  }
}

Related searches

moody grey blue paletteindustrial color schemeurban dark aestheticcool minimalist colorssomber blue grey palette

Palette colors

Hex values

Color 1#6B7B8E
·
Color 2#8C9CAB
·
Color 3#AFC1D1
·
Color 4#3C4752
·
Color 5#293038
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.3:1Fail
2.2:1Fail
3.1:1AA18
2
1.5:1Fail
1.5:1Fail
3.4:1AA18
4.7:1AA
3
2.3:1Fail
1.5:1Fail
5.1:1AA
7.2:1AAA
4
2.2:1Fail
3.4:1AA18
5.1:1AA
1.4:1Fail
5
3.1:1AA18
4.7:1AA
7.2:1AAA
1.4:1Fail

Similar palettes

More like Acid Rain Gloom

View all dark