Back to palettes

Palette

Monochrome Smoke Flow

The soft, ethereal movement of smoke, captured in a smooth, understated grayscale.

monochromeminimal5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Monochrome Smoke Flow 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 Monochrome Smoke Flow.

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

Data visualization

#1C1C1C#2F4F4F#424242#708090#A9A9A9

Palette guide

How to use Monochrome Smoke Flow

Overview

This monochrome palette, "Monochrome Smoke Flow," offers a sophisticated gradient of dark to medium grays, perfect for creating understated and elegant designs. Featuring deep tones like #1C1C1C and #2F4F4F, alongside softer grays such as #708090 and #A9A9A9, it evokes the ethereal movement of smoke. Designers can leverage its subtle shifts for depth without relying on vibrant hues, making it ideal for minimalist interfaces, sophisticated branding, and atmospheric digital art. Developers will find these hex codes straightforward for implementing dark mode themes or refined UI elements, ensuring a cohesive and professional aesthetic that emphasizes content and subtle transitions.

Best used for

  • Minimalist website designs and dark mode interfaces
  • Luxury branding and corporate identity
  • Photography portfolios and art galleries
  • UI/UX for productivity apps and professional tools
  • Atmospheric digital illustrations and abstract art
  • Sophisticated editorial layouts

Suggested color roles

primary

#1C1C1C - Ideal for dominant backgrounds in dark themes or strong structural elements, providing a deep, grounding presence.

secondary

#2F4F4F - Excellent for secondary backgrounds, large content blocks, or subtle dividers, offering a slightly lighter, yet still profound, shade.

accent

#708090 - Use sparingly for subtle highlights, interactive states, or decorative elements that need to stand out gently against darker tones.

background

#1C1C1C - A deep, rich background that provides a sophisticated canvas, enhancing content in light text.

text

#A9A9A9 - A soft, legible gray for primary body text against darker backgrounds, ensuring readability without harsh contrast. Alternatively, use pure white for maximum contrast on #1C1C1C.

Accessibility notes

  • Ensure sufficient contrast between text and background, especially when using lighter grays like #A9A9A9 on #708090.
  • For #1C1C1C backgrounds, use white or very light gray text for optimal readability (WCAG AA usually requires ~7:1 for small text).
  • Avoid using similar shades like #424242 and #2F4F4F for adjacent interactive elements to prevent confusion.
  • Test colorblind accessibility; while monochrome, value differences are key for distinction.

Recommended combinations

Deep Contrast

High-contrast dark mode base with a soft accent for interactive elements.

#1C1C1C · #A9A9A9 · #708090

Smooth Gradient

Creating subtle visual depth and transitions in UI elements or backgrounds.

#2F4F4F · #424242 · #708090

Elegant Base

A sophisticated foundation for branding, using the lightest shade for primary text.

#1C1C1C · #2F4F4F · #A9A9A9

CSS variables

:root {
  --monochrome-smoke-flow-1: #1C1C1C;
  --monochrome-smoke-flow-2: #2F4F4F;
  --monochrome-smoke-flow-3: #424242;
  --monochrome-smoke-flow-4: #708090;
  --monochrome-smoke-flow-5: #A9A9A9;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "monochrome-smoke-flow": {
        1: "#1C1C1C",
        2: "#2F4F4F",
        3: "#424242",
        4: "#708090",
        5: "#A9A9A9",
      }
    }
  }
}

Related searches

dark gray color schememonochrome UI designelegant dark palettesmoke effect colorsminimalist grey branding

Palette colors

Hex values

Color 1#1C1C1C
·
Color 2#2F4F4F
·
Color 3#424242
·
Color 4#708090
·
Color 5#A9A9A9
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
1.7:1Fail
4.2:1AA18
7.3:1AAA
2
1.9:1Fail
1.1:1Fail
2.2:1Fail
3.8:1AA18
3
1.7:1Fail
1.1:1Fail
2.5:1Fail
4.3:1AA18
4
4.2:1AA18
2.2:1Fail
2.5:1Fail
1.7:1Fail
5
7.3:1AAA
3.8:1AA18
4.3:1AA18
1.7:1Fail

Similar palettes

More like Monochrome Smoke Flow

View all monochrome