Back to palettes

Palette

Monsoon Bloom

Rich, moisture-laden teals and greens, like a tropical garden revitalized by a refreshing monsoon.

coolnatural5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#2C535C#477A7A#6DA3A3#9BD6D6#C2F2F2

Palette guide

How to use Monsoon Bloom

Overview

The "Monsoon Bloom" palette, categorized as cool, captures the rich, moisture-laden teals and greens of a tropical garden revitalized by rain. Ranging from the deep, mysterious #2C535C to the refreshing #477A7A and #6DA3A3, it gradually lightens to the airy #9BD6D6 and the delicate, almost translucent #C2F2F2. This palette is ideal for designs aiming to convey freshness, tranquility, and an exotic natural elegance. Designers can leverage it for spa brands, aquatic themes, or serene digital interfaces. Developers will find these hex codes excellent for creating calming backgrounds, inviting UI elements, and a cohesive visual experience that evokes a sense of peace and natural beauty.

Best used for

  • Spa and wellness brand identities
  • Aquatic sports or marine conservation websites
  • Tropical travel agencies and resort promotions
  • Eco-friendly product packaging with a cool theme
  • Meditation and relaxation apps
  • Clean, modern UI designs

Suggested color roles

primary

#2C535C - A deep, sophisticated teal, ideal for main backgrounds, headers, or strong brand elements, symbolizing depth and calm.

secondary

#477A7A - A rich, inviting teal, excellent for secondary content blocks, navigation, or supportive graphic elements.

accent

#9BD6D6 - A light, refreshing teal, perfect for subtle highlights, interactive states, or decorative elements that mimic water reflections.

background

#C2F2F2 - A very light, almost white-blue, providing an airy and expansive canvas that allows darker teals to feel vibrant.

text

#2C535C - A deep, legible teal for primary body text against light backgrounds like #C2F2F2, ensuring natural readability. A dark gray or black also works well.

Accessibility notes

  • #2C535C on #C2F2F2 offers excellent contrast for primary text.
  • Avoid using #9BD6D6 as text on #C2F2F2 backgrounds due to insufficient contrast.
  • Ensure interactive elements have clear visual states, perhaps using a slightly darker shade for hover.
  • Contrast ratios should be checked, especially when using #6DA3A3 for text on #9BD6D6.

Recommended combinations

Deep Waters

A strong, deep teal base with a light, airy background and a supportive mid-tone.

#2C535C · #C2F2F2 · #477A7A

Aqua Gradient

Creating smooth, watery transitions for backgrounds or subtle visual depth.

#477A7A · #6DA3A3 · #9BD6D6

Refreshing UI

Deep primary with a light accent for interactive elements on a clean, cool background.

#2C535C · #9BD6D6 · #C2F2F2

CSS variables

:root {
  --monsoon-bloom-1: #2C535C;
  --monsoon-bloom-2: #477A7A;
  --monsoon-bloom-3: #6DA3A3;
  --monsoon-bloom-4: #9BD6D6;
  --monsoon-bloom-5: #C2F2F2;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "monsoon-bloom": {
        1: "#2C535C",
        2: "#477A7A",
        3: "#6DA3A3",
        4: "#9BD6D6",
        5: "#C2F2F2",
      }
    }
  }
}

Related searches

teal green palettecool tropical colorsaquatic color schemeserene UI designrefreshing brand identity

Palette colors

Hex values

Color 1#2C535C
·
Color 2#477A7A
·
Color 3#6DA3A3
·
Color 4#9BD6D6
·
Color 5#C2F2F2
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
3:1Fail
5.2:1AA
6.9:1AA
2
1.7:1Fail
1.7:1Fail
3:1Fail
4:1AA18
3
3:1Fail
1.7:1Fail
1.8:1Fail
2.3:1Fail
4
5.2:1AA
3:1Fail
1.8:1Fail
1.3:1Fail
5
6.9:1AA
4:1AA18
2.3:1Fail
1.3:1Fail

Similar palettes

More like Monsoon Bloom

View all cool
Dewdrop Emerald Vine
Emerald Grove Sanctuary
Emerald Peak Summit
Emerald Valley Mist
Monsoon Rain Greens
Rainfall Bloom