Back to palettes

Palette

Tranquil Morning Dew

Light, ethereal blues and greens evoke the delicate freshness and sparkling clarity of morning dew on grass.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Tranquil Morning Dew 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 Tranquil Morning Dew.

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

Data visualization

#F0FFF0#E0FFFF#AFEEEE#B0C4DE#87CEEB

Palette guide

How to use Tranquil Morning Dew

Overview

The Tranquil Morning Dew palette is a collection of extremely light and airy blues and greens, evoking the delicate freshness of dew-kissed nature. Ranging from the almost-white #F0FFF0 and #E0FFFF to the soft #AFEEEE, #B0C4DE, and the slightly deeper #87CEEB, this palette is ideal for designers and developers seeking to create exceptionally light, clean, and refreshing interfaces. Its ethereal quality makes it perfect for projects that require a sense of purity, new beginnings, or gentle clarity. The subtle shifts in tone provide enough distinction for hierarchy while maintaining an overall serene and expansive feel.

Best used for

  • Minimalist web and app interfaces
  • Baby product branding and packaging
  • Cloud computing or data visualization dashboards
  • Health and wellness content requiring a fresh feel
  • Wedding invitations and stationery design
  • Light and airy photography websites

Suggested color roles

primary

The darkest shade, #87CEEB, can serve as a primary accent or for important text on the lightest backgrounds. It provides the most visual weight.

secondary

Utilize #B0C4DE for supportive accents, borders, or very subtle background elements. It's a soft, muted blue.

accent

Apply #AFEEEE for light highlights, interactive states, or subtle graphic details. Its pale green-blue adds a touch of freshness.

background

Designate #F0FFF0 or #E0FFFF as the main background colors. Their near-white quality ensures maximum brightness and openness.

text

For text, a very dark grey or charcoal is recommended on these light backgrounds for readability. If using palette colors, #87CEEB or #B0C4DE can work for larger headings, but contrast is crucial. A true black will offer the best contrast.

Accessibility notes

  • Due to the extreme lightness of this palette, rely on a very dark neutral (like charcoal or black) for body text on #F0FFF0 or #E0FFFF backgrounds to ensure readability.
  • Avoid using lighter palette colors like #AFEEEE or #B0C4DE for small text on any background within this palette, as contrast will be insufficient.
  • For larger headings, #87CEEB on #F0FFF0 might pass WCAG AA, but always verify.
  • Use generous line-height and font sizes if attempting to use palette colors for text to aid readability.

Recommended combinations

Fresh Start

Very light background with the darkest palette color for accents or large headings, and a soft highlight.

#F0FFF0 · #87CEEB · #AFEEEE

Sky Gradient

Ideal for subtle background gradients or abstract illustrations, evoking a clear, expansive sky.

#E0FFFF · #B0C4DE · #87CEEB

Dewdrop Detail

Use these very light tones for delicate UI elements, borders, or decorative patterns, maintaining an airy feel.

#AFEEEE · #F0FFF0 · #B0C4DE

CSS variables

:root {
  --tranquil-morning-dew-1: #F0FFF0;
  --tranquil-morning-dew-2: #E0FFFF;
  --tranquil-morning-dew-3: #AFEEEE;
  --tranquil-morning-dew-4: #B0C4DE;
  --tranquil-morning-dew-5: #87CEEB;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "tranquil-morning-dew": {
        1: "#F0FFF0",
        2: "#E0FFFF",
        3: "#AFEEEE",
        4: "#B0C4DE",
        5: "#87CEEB",
      }
    }
  }
}

Related searches

light blue green paletteairy ui design colorsfresh web color schememinimalist cool pastelsmorning dew brand identity

Palette colors

Hex values

Color 1#F0FFF0
·
Color 2#E0FFFF
·
Color 3#AFEEEE
·
Color 4#B0C4DE
·
Color 5#87CEEB
·

Accessibility

Contrast checker

1
2
3
4
5
1
1:1Fail
1.2:1Fail
1.7:1Fail
1.7:1Fail
2
1:1Fail
1.2:1Fail
1.7:1Fail
1.7:1Fail
3
1.2:1Fail
1.2:1Fail
1.4:1Fail
1.4:1Fail
4
1.7:1Fail
1.7:1Fail
1.4:1Fail
1:1Fail
5
1.7:1Fail
1.7:1Fail
1.4:1Fail
1:1Fail

Similar palettes

More like Tranquil Morning Dew

View all cool
Misty Morning Dew
Morning Cloud Ascent
Seaside Brunch
Whispering Willow Breezes
Aqua Seafoam Dream
Celestial Azure Drift