Back to palettes

Palette

Green Tea Serenity

Soothing greens reflecting the peaceful, balanced tranquility of a ceremonial green tea garden.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Green Tea Serenity 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 Green Tea Serenity.

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

Data visualization

#A7C49C#7BBF8E#5EAA7C#4A9C6F#387F55

Palette guide

How to use Green Tea Serenity

Overview

The Green Tea Serenity palette offers a truly soothing gradient of cool greens, perfectly capturing the peaceful ambiance of a ceremonial tea garden. Ranging from the light, airy #A7C49C to the deep, grounding #387F55, with harmonious mid-tones like #5EAA7C and #4A9C6F, this palette is a designer's dream for evoking calm and balance. It's an excellent choice for projects that aim to convey natural elegance, mindfulness, or a sense of tranquil well-being. Developers and designers can utilize these harmonious shades to create serene user interfaces, sophisticated branding, and inviting digital or print materials that resonate with a calm, natural aesthetic.

Best used for

  • Wellness apps and meditation guides
  • Eco-luxury branding
  • Spa and retreat websites
  • Natural beauty product packaging
  • Zen garden inspired designs
  • Mindfulness resources

Suggested color roles

primary

Use #387F55 as a deep, stable primary color for main branding, headers, or important calls-to-action.

secondary

Apply #4A9C6F for subheadings, secondary buttons, or prominent content blocks, offering a supportive, rich green.

accent

Employ #A7C49C as a light, fresh accent for delicate highlights, interactive elements, or soft visual cues.

background

Utilize #A7C49C for light, airy main content backgrounds, or #7BBF8E for a more serene, muted canvas.

text

For crisp readability, use a dark text color like #387F55 against lighter backgrounds, or off-white on darker greens.

Accessibility notes

  • Ensure #387F55 text on #A7C49C backgrounds meets WCAG AA contrast standards.
  • Be mindful when using #A7C49C for small text; it may lack sufficient contrast on very light backgrounds.
  • Use a contrast checker for all text and interactive elements, especially with the mid-tones like #7BBF8E.
  • Reserve lighter shades for larger text or decorative elements to maintain optimal readability.

Recommended combinations

Zen Garden

Ideal for a balanced layout, using the deep green for text, light for backgrounds, and mid-tone for accents.

#387F55 · #A7C49C · #5EAA7C

Tea Leaf

Creates a rich, layered effect suitable for illustrations, infographics, or textured backgrounds.

#4A9C6F · #7BBF8E · #387F55

Misty Morning

Perfect for soft gradients or sections that need a gentle transition, maintaining a serene feel.

#A7C49C · #7BBF8E · #4A9C6F

CSS variables

:root {
  --green-tea-serenity-1: #A7C49C;
  --green-tea-serenity-2: #7BBF8E;
  --green-tea-serenity-3: #5EAA7C;
  --green-tea-serenity-4: #4A9C6F;
  --green-tea-serenity-5: #387F55;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "green-tea-serenity": {
        1: "#A7C49C",
        2: "#7BBF8E",
        3: "#5EAA7C",
        4: "#4A9C6F",
        5: "#387F55",
      }
    }
  }
}

Related searches

cool green palettezen color schemenatural calm colorstea inspired brandingserene green UI

Palette colors

Hex values

Color 1#A7C49C
·
Color 2#7BBF8E
·
Color 3#5EAA7C
·
Color 4#4A9C6F
·
Color 5#387F55
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
1.5:1Fail
1.8:1Fail
2.5:1Fail
2
1.1:1Fail
1.3:1Fail
1.5:1Fail
2.2:1Fail
3
1.5:1Fail
1.3:1Fail
1.2:1Fail
1.7:1Fail
4
1.8:1Fail
1.5:1Fail
1.2:1Fail
1.4:1Fail
5
2.5:1Fail
2.2:1Fail
1.7:1Fail
1.4:1Fail

Similar palettes

More like Green Tea Serenity

View all cool