Palette

Jade Tea Ceremony

Refreshing green and creamy whites evoke the tranquil focus of a Japanese tea ritual.

coolcalm5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#5A8C6F#8DBAA3#C0E8D7#E0F5EB#3A6D52

Palette guide

How to use Jade Tea Ceremony

Overview

The Jade Tea Ceremony palette offers a refreshing and tranquil experience, perfect for designs seeking a serene, nature-inspired aesthetic. Centered around calming greens like the deep #3A6D52 and the vibrant primary #5A8C6F, this palette evokes the peaceful focus of traditional tea rituals. Complementary lighter shades such as the airy #E0F5EB and the subtle #C0E8D7 provide excellent bases and accents, allowing for a balanced visual flow. Designers and developers can leverage these harmonious greens to create inviting, sophisticated interfaces and branding that convey natural elegance and a sense of well-being. This scheme is ideal for projects where calm and organic appeal are paramount.

Best used for

Wellness and spa branding
Eco-friendly product packaging and websites
Nature-inspired digital interfaces
Meditation or mindfulness app design
Interior design mood boards
Sustainable fashion brand identity

Suggested color roles

primary

#5A8C6F serves as the grounding, core identity color, embodying natural balance and sophistication.

secondary

#8DBAA3 provides a softer, supportive layer, excellent for secondary elements, illustrations, or background textures.

accent

#3A6D52 offers a deep, rich accent for calls-to-action, important headings, or strong brand elements, providing excellent contrast.

background

#E0F5EB creates a clean, airy, and calming canvas, enhancing readability and allowing other colors to truly shine.

text

For strong headings, use #3A6D52. For body copy, a very dark charcoal or black (e.g., #333333) against #E0F5EB ensures optimal readability.

Accessibility notes

Ensure sufficient contrast when using #3A6D52 for text on #E0F5EB or #C0E8D7 backgrounds.
Avoid placing lighter greens like #8DBAA3 on #C0E8D7 for critical information due to low contrast.
Validate all text and interactive element color combinations against WCAG AA guidelines, especially for small text.
Use #5A8C6F or #3A6D52 for primary text on light backgrounds to ensure readability for users with visual impairments.

Recommended combinations

Earthy Harmony

Ideal for a strong brand presence, using deep green for impact, medium for core, and light for airy backgrounds.

#3A6D52 · #5A8C6F · #E0F5EB

Soft Serenity

Creates a gentle, subtle aesthetic perfect for delicate illustrations, light UI elements, or subtle gradients.

#C0E8D7 · #8DBAA3 · #E0F5EB

Deep Contrast

Leverages a medium green with a dark accent against a very light background for clear hierarchy and readability.

#5A8C6F · #3A6D52 · #E0F5EB

CSS variables

:root {
  --jade-tea-ceremony-3-1: #5A8C6F;
  --jade-tea-ceremony-3-2: #8DBAA3;
  --jade-tea-ceremony-3-3: #C0E8D7;
  --jade-tea-ceremony-3-4: #E0F5EB;
  --jade-tea-ceremony-3-5: #3A6D52;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "jade-tea-ceremony-3": {
        1: "#5A8C6F",
        2: "#8DBAA3",
        3: "#C0E8D7",
        4: "#E0F5EB",
        5: "#3A6D52",
      }
    }
  }
}

Hex values

Color 1#5A8C6F

Color 2#8DBAA3

Color 3#C0E8D7

Color 4#E0F5EB

Color 5#3A6D52

Accessibility

Contrast checker

1.8:1Fail

2.9:1Fail

3.4:1AA18

1.6:1Fail

1.8:1Fail

1.6:1Fail

1.9:1Fail

2.8:1Fail

2.9:1Fail

1.6:1Fail

1.2:1Fail

4.5:1AA

3.4:1AA18

1.9:1Fail

1.2:1Fail

5.3:1AA

1.6:1Fail

2.8:1Fail

4.5:1AA

5.3:1AA

Similar palettes

More like Jade Tea Ceremony

Jade Tea Ceremony

See it in context.

Ready when you are.

Built with Jade Tea Ceremony.

How to use Jade Tea Ceremony

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Earthy Harmony

Soft Serenity

Deep Contrast

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Jade Tea Ceremony