Palette

Riverbed Moss Flow

Captures the serene, cool greens of moss and pebbles found along a gentle riverbed, promoting a sense of calm.

coolcalm5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Riverbed Moss 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 Riverbed Moss Flow.

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

Data visualization

#3E5F5A#628B7D#90B79F#C2DDB6#DDF2D0

Palette guide

How to use Riverbed Moss Flow

Overview

The Riverbed Moss Flow palette beautifully captures the serene, cool greens of moss and pebbles found along a gentle riverbed, promoting a profound sense of calm. Ranging from the deep, forest-like #3E5F5A to the airy #DDF2D0, with harmonious mid-tones like #628B7D, #90B79F, and #C2DDB6, this collection is perfect for creating tranquil and nature-inspired designs. Designers and developers can leverage these refreshing hues to evoke growth, tranquility, and a grounded connection to the natural world in their projects.

Best used for

Eco-friendly brand identity
Nature conservation websites
Wellness and yoga studio branding
Botanical garden signage
Outdoor lifestyle product packaging
Sustainable fashion platforms

Suggested color roles

primary

#628B7D - A balanced, natural green, ideal for foundational elements, providing a calm and organic presence.

secondary

#90B79F - A lighter, softer green that complements the primary, suitable for secondary information, subtle dividers, or background textures.

accent

#3E5F5A - The deepest, rich teal-green, perfect for strong accents, call-to-action buttons, or elements requiring a grounding, sophisticated visual weight.

background

#DDF2D0 - The lightest tone, serving as a clean, airy canvas that enhances the palette's fresh and expansive quality.

text

#3E5F5A - This deep teal-green offers excellent readability for body text on the light #DDF2D0 background, providing a natural and inviting textual presence.

Accessibility notes

#3E5F5A on #DDF2D0 provides strong contrast, suitable for all text sizes and meeting WCAG AA standards.
Be cautious when using #C2DDB6 or #90B79F for text on #DDF2D0; contrast may be insufficient, especially for smaller fonts.
Ensure interactive elements have clear visual indicators for focus and hover states, maintaining sufficient contrast.
Consider using a slightly darker grey or charcoal for extensive body text if #3E5F5A feels too vibrant for some users.

Recommended combinations

Fresh Earth

Ideal for a clean, natural web layout, using the lightest as background, the deep green for main text, and mid-green for headings.

#DDF2D0 · #3E5F5A · #628B7D

Mossy Layers

Use for creating subtle depth in UI components or illustrations, offering a soft, organic layering effect reminiscent of moss.

#90B79F · #C2DDB6 · #628B7D

Deep Forest

Employ the deepest shade for prominent branding or hero sections, balanced by the lightest for clarity and a mid-green for supporting content.

#3E5F5A · #DDF2D0 · #90B79F

CSS variables

:root {
  --riverbed-moss-flow-2-1: #3E5F5A;
  --riverbed-moss-flow-2-2: #628B7D;
  --riverbed-moss-flow-2-3: #90B79F;
  --riverbed-moss-flow-2-4: #C2DDB6;
  --riverbed-moss-flow-2-5: #DDF2D0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "riverbed-moss-flow-2": {
        1: "#3E5F5A",
        2: "#628B7D",
        3: "#90B79F",
        4: "#C2DDB6",
        5: "#DDF2D0",
      }
    }
  }
}

Hex values

Color 1#3E5F5A

Color 2#628B7D

Color 3#90B79F

Color 4#C2DDB6

Color 5#DDF2D0

Accessibility

Contrast checker

1.8:1Fail

3.2:1AA18

4.8:1AA

5.9:1AA

1.8:1Fail

1.7:1Fail

2.6:1Fail

3.2:1AA18

1.7:1Fail

1.5:1Fail

1.9:1Fail

4.8:1AA

2.6:1Fail

1.5:1Fail

1.2:1Fail

5.9:1AA

3.2:1AA18

1.9:1Fail

1.2:1Fail

Similar palettes

More like Riverbed Moss Flow

Riverbed Moss Flow

See it in context.

Ready when you are.

Built with Riverbed Moss Flow.

How to use Riverbed Moss Flow

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Fresh Earth

Mossy Layers

Deep Forest

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Riverbed Moss Flow