Back to palettes

Palette

Rainy Window Pane

Muted greys and a hint of soft blue reflect the quiet, hazy world viewed through a rain-streaked window.

monochromecalm5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Rainy Window Pane 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 Rainy Window Pane.

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

Data visualization

#2F4F4F#708090#A9A9A9#C0C0C0#E0FFFF

Palette guide

How to use Rainy Window Pane

Overview

The Rainy Window Pane palette captures the soft, diffused light and muted tones seen through a rain-streaked window, offering a serene blend of cool grays and a hint of blue-green. Beginning with the deep, mysterious #2F4F4F, it flows into the calming #708090 and the classic #A9A9A9, culminating in the ethereal near-white #E0FFFF. This palette is ideal for designs seeking a tranquil, contemplative, and sophisticated atmosphere. Designers and developers can utilize these colors for clean UIs, calming backgrounds, or branding that evokes a sense of quiet reflection and understated elegance, perfect for environments that prioritize peace and clarity.

Best used for

  • Wellness and meditation apps
  • Minimalist home decor websites
  • Photography portfolios
  • Art gallery digital presentations
  • Serene blog themes
  • Eco-friendly product branding

Suggested color roles

primary

#2F4F4F - A deep, dark blue-green, providing a strong, calming base for large sections or foundational elements.

secondary

#708090 - A sophisticated slate gray, excellent for supporting content, backgrounds of panels, or subtle visual separation.

accent

#A9A9A9 - A medium gray that can be used for delicate outlines, interactive elements that need a soft touch, or subtle highlights.

background

#E0FFFF - A very light, almost white, icy blue, creating an airy, expansive, and clean canvas.

text

#2F4F4F - Offers superb readability on the light #E0FFFF background, ensuring clear, crisp body text and headlines.

Accessibility notes

  • Ensure sufficient contrast between #A9A9A9 or #C0C0C0 when used as text on light backgrounds like #E0FFFF.
  • The dark #2F4F4F provides excellent contrast against #E0FFFF for body text, ensuring high readability.
  • Avoid using mid-tones like #708090 on #A9A9A9 for text without checking contrast ratios carefully.
  • For critical information, consider using the darkest color, #2F4F4F, on the lightest, #E0FFFF, for maximum accessibility.

Recommended combinations

Misty Horizon

Creates a deep, serene base with a soft, airy highlight, ideal for calm interfaces and contemplative themes.

#2F4F4F · #708090 · #E0FFFF

Gentle Layers

Provides subtle depth and visual interest through gentle transitions, perfect for background textures or card elements.

#708090 · #A9A9A9 · #C0C0C0

Clear View

Uses strong contrast for readability and a clean aesthetic, excellent for primary content blocks and headings.

#2F4F4F · #C0C0C0 · #E0FFFF

CSS variables

:root {
  --rainy-window-pane-1: #2F4F4F;
  --rainy-window-pane-2: #708090;
  --rainy-window-pane-3: #A9A9A9;
  --rainy-window-pane-4: #C0C0C0;
  --rainy-window-pane-5: #E0FFFF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "rainy-window-pane": {
        1: "#2F4F4F",
        2: "#708090",
        3: "#A9A9A9",
        4: "#C0C0C0",
        5: "#E0FFFF",
      }
    }
  }
}

Related searches

calm grey blue paletteserene monochrome colorsrainy day aesthetic paletteminimalist cool tonespeaceful UI design colors

Palette colors

Hex values

Color 1#2F4F4F
·
Color 2#708090
·
Color 3#A9A9A9
·
Color 4#C0C0C0
·
Color 5#E0FFFF
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.2:1Fail
3.8:1AA18
4.9:1AA
8.5:1AAA
2
2.2:1Fail
1.7:1Fail
2.2:1Fail
3.8:1AA18
3
3.8:1AA18
1.7:1Fail
1.3:1Fail
2.2:1Fail
4
4.9:1AA
2.2:1Fail
1.3:1Fail
1.7:1Fail
5
8.5:1AAA
3.8:1AA18
2.2:1Fail
1.7:1Fail

Similar palettes

More like Rainy Window Pane

View all monochrome
Grayscale City Rain
Misty Lagoon
Silver Birch Whispers
Azure Ripple Effect
Cobalt Flow
Contemplative Stone Flow