Back to palettes

Palette

Matcha Tea Ceremony

A calming and refined palette, drawing from the earthy, quiet elegance of a traditional matcha ceremony.

earthcalm5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Matcha Tea Ceremony 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 Matcha Tea Ceremony.

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

Data visualization

#527A5B#739D7E#A0C5A9#D2E4D8#EAF3EC

Palette guide

How to use Matcha Tea Ceremony

Overview

The Matcha Tea Ceremony color palette offers a serene and refined collection of greens, perfect for designs seeking a calming, natural aesthetic. Anchored by the deep, contemplative #527A5B, it gracefully transitions through the balanced #739D7E and the soft #A0C5A9, culminating in the airy #D2E4D8 and the whisper-light #EAF3EC. This palette evokes the quiet elegance of traditional Japanese rituals, blending earthy sophistication with a clean, subtle freshness. Designers can leverage its harmonious tones to create spaces and interfaces that feel grounded, tranquil, and inherently sophisticated, providing a gentle visual experience without sacrificing depth.

Best used for

  • Wellness and spa branding or websites
  • Eco-friendly product packaging and labels
  • Minimalist home decor and interior design concepts
  • Zen garden inspired digital interfaces
  • Sustainable fashion brand identity
  • Mindfulness app design and user interfaces

Suggested color roles

primary

#527A5B - This deep, grounding green serves as the palette's anchor, ideal for main headings, prominent buttons, or large background sections where a sense of stability and depth is desired.

secondary

#739D7E - A balanced, supportive green perfect for subheadings, navigation elements, or secondary calls-to-action, offering a harmonious contrast to the primary shade.

accent

#A0C5A9 - This lighter, gentle green works beautifully for subtle highlights, interactive states, or decorative elements that need a touch of freshness without being overly vibrant.

background

#EAF3EC - The lightest shade, providing a clean, expansive canvas that allows other colors to breathe. Excellent for page backgrounds, card elements, or modal overlays.

text

#527A5B - For optimal readability and a cohesive look, use this darkest green for body text on lighter backgrounds like #EAF3EC or #D2E4D8. For very light text, a near-black like #333333 could also be considered for maximum contrast.

Accessibility notes

  • Ensure #527A5B and #739D7E have sufficient contrast against #EAF3EC for all text sizes to meet WCAG AA standards.
  • Avoid using #A0C5A9 for small text on #D2E4D8 or #EAF3EC as contrast will likely be insufficient; reserve it for larger headings or decorative elements.
  • When pairing #D2E4D8 with #EAF3EC, use these combinations for background elements only, not for text, due to low contrast.
  • For interactive elements, ensure focus states use a color with strong contrast against the default state, such as #527A5B on #EAF3EC.

Recommended combinations

Earthy Core

Ideal for a brand's primary identity, combining strong presence with a clean, breathable background for text and UI elements.

#527A5B · #739D7E · #EAF3EC

Subtle Harmony

Creates a gentle, soft aesthetic perfect for secondary pages, informational graphics, or designs where a very light, airy feel is paramount.

#739D7E · #A0C5A9 · #D2E4D8

Deep Tranquility

Utilizes the deepest green for impact, softened by lighter tones for a sophisticated, calming layout suitable for hero sections or contemplative content.

#527A5B · #D2E4D8 · #A0C5A9

CSS variables

:root {
  --matcha-tea-ceremony-3-1: #527A5B;
  --matcha-tea-ceremony-3-2: #739D7E;
  --matcha-tea-ceremony-3-3: #A0C5A9;
  --matcha-tea-ceremony-3-4: #D2E4D8;
  --matcha-tea-ceremony-3-5: #EAF3EC;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "matcha-tea-ceremony-3": {
        1: "#527A5B",
        2: "#739D7E",
        3: "#A0C5A9",
        4: "#D2E4D8",
        5: "#EAF3EC",
      }
    }
  }
}

Related searches

matcha green color schemeserene green palette for designearthy japanese aesthetic colorscalming green web design palettesubtle nature inspired colors

Palette colors

Hex values

Color 1#527A5B
·
Color 2#739D7E
·
Color 3#A0C5A9
·
Color 4#D2E4D8
·
Color 5#EAF3EC
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.6:1Fail
3.7:1AA18
4.3:1AA18
2
1.6:1Fail
1.6:1Fail
2.3:1Fail
2.7:1Fail
3
2.6:1Fail
1.6:1Fail
1.4:1Fail
1.7:1Fail
4
3.7:1AA18
2.3:1Fail
1.4:1Fail
1.2:1Fail
5
4.3:1AA18
2.7:1Fail
1.7:1Fail
1.2:1Fail

Similar palettes

More like Matcha Tea Ceremony

View all earth
Jade Tea Ceremony
Ancient Moss Whisper
Ancient River Stones
Bamboo Grove
Japanese Tea Garden
Matcha Ceremonial Blend