Palette

Monsoon Cloud Sky

A moody gradient of deep to light greys, capturing the dramatic, heavy skies before a monsoon.

monochromedark5 colors

More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Monsoon Cloud Sky 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 Monsoon Cloud Sky.

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

Data visualization

#4F4F4F#696969#808080#A9A9A9#C0C0C0

Palette guide

How to use Monsoon Cloud Sky

Overview

The "Monsoon Cloud Sky" palette offers a moody and dramatic gradient of deep to light grays, perfectly capturing the heavy, atmospheric skies before a monsoon. Ranging from the dark #4F4F4F and #696969, through the balanced #808080, to the lighter #A9A9A9 and #C0C0C0, it provides a sophisticated monochromatic range. This palette is ideal for designs that aim to convey seriousness, modern elegance, or a contemplative mood. Designers can leverage it for conceptual art, corporate websites, or minimalist interfaces. Developers will find these hex codes excellent for implementing dark mode themes, subtle UI elements, and creating a cohesive, professional aesthetic that emphasizes structure and subtle shifts in tone.

Best used for

Dark mode themes for professional applications
Conceptual art and photography websites
Corporate and financial services branding
Minimalist UI/UX design with a focus on content
Weather-related apps or scientific data visualization
Architectural and industrial design presentations

Suggested color roles

primary

#4F4F4F - A deep, solid gray, ideal for dominant backgrounds in dark themes or strong structural elements, conveying stability.

secondary

#696969 - A slightly lighter, yet still substantial gray, excellent for secondary backgrounds, large content blocks, or subtle dividers.

accent

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

background

#C0C0C0 - A soft, light gray, providing a clean and versatile canvas that allows darker tones to stand out.

text

#4F4F4F - A strong, dark gray for primary body text against lighter backgrounds like #C0C0C0, ensuring excellent readability. Alternatively, use black for maximum contrast.

Accessibility notes

Ensure sufficient contrast between text and background; #4F4F4F on #C0C0C0 offers good readability.
Avoid using #808080 for small text on #A9A9A9 backgrounds due to low contrast.
For dark backgrounds like #4F4F4F, ensure text is light enough (e.g., #C0C0C0 or white) for optimal readability.
Use clear visual cues beyond color for interactive elements, especially with subtle gray shifts.

Recommended combinations

Stormy Contrast

High-contrast dark base with a light text color and a balanced mid-tone accent.

#4F4F4F · #C0C0C0 · #808080

Cloud Layers

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

#696969 · #808080 · #A9A9A9

Monsoon Sky

Deep primary with a lighter accent and a soft background for a moody, sophisticated look.

#4F4F4F · #A9A9A9 · #C0C0C0

CSS variables

:root {
  --monsoon-cloud-sky-1: #4F4F4F;
  --monsoon-cloud-sky-2: #696969;
  --monsoon-cloud-sky-3: #808080;
  --monsoon-cloud-sky-4: #A9A9A9;
  --monsoon-cloud-sky-5: #C0C0C0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "monsoon-cloud-sky": {
        1: "#4F4F4F",
        2: "#696969",
        3: "#808080",
        4: "#A9A9A9",
        5: "#C0C0C0",
      }
    }
  }
}

Hex values

Color 1#4F4F4F

Color 2#696969

Color 3#808080

Color 4#A9A9A9

Color 5#C0C0C0

Accessibility

Contrast checker

1.5:1Fail

2.1:1Fail

3.5:1AA18

4.5:1AA

1.5:1Fail

1.4:1Fail

2.3:1Fail

3:1AA18

2.1:1Fail

1.4:1Fail

1.7:1Fail

2.2:1Fail

3.5:1AA18

2.3:1Fail

1.7:1Fail

1.3:1Fail

4.5:1AA

3:1AA18

2.2:1Fail

1.3:1Fail

Similar palettes

More like Monsoon Cloud Sky

View all monochrome

Monochromatic Storm Sky