Palette

Jade Temple Bloom

Cool, crisp greens and teals evoke ancient, serene temples surrounded by lush, vibrant foliage.

coolcalm5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#005953#008080#48C9B0#A9DFBF#F8F0E3

Palette guide

How to use Jade Temple Bloom

Overview

The Jade Temple Bloom palette offers a serene and elegant blend of cool greens and teals, ideal for evoking tranquility and natural sophistication. Anchored by the deep, rich #005953, it transitions through the vibrant teal of #008080 and the refreshing #48C9B0, culminating in the soft, airy #A9DFBF and a creamy, warm #F8F0E3. This palette is perfect for designs seeking a calming yet refined aesthetic, reminiscent of lush foliage and ancient, peaceful spaces. Designers and developers can leverage its balanced harmony to create inviting and visually soothing user experiences across various platforms. Its inherent coolness provides a crisp, clean feel.

Best used for

Luxury spa and wellness brands
Eco-friendly product packaging and branding
Nature-inspired mobile applications or websites
High-end interior design concepts
Yoga studios and meditation apps
Sustainable fashion branding

Suggested color roles

primary

#005953. A deep, grounding jade green, perfect for main branding elements, prominent buttons, or large content blocks that require a sense of stability and luxury.

secondary

#008080. A vibrant teal that complements the primary, excellent for subheadings, active states, or secondary calls-to-action, adding a refreshing touch.

accent

#48C9B0. A bright, energetic mint green, ideal for highlights, interactive elements, or small graphic details that need to pop and draw immediate attention.

background

#F8F0E3. A soft, creamy off-white that provides a clean, breathable canvas, ensuring excellent readability and a warm, inviting feel for main content areas.

text

Use #005953 for primary body text on light backgrounds like #F8F0E3 to ensure high readability and a cohesive color story. For headings, a crisp black or near-black can also work.

Accessibility notes

Ensure sufficient contrast when using #A9DFBF for text on #F8F0E3; consider increasing text size or weight.
The dark #005953 provides excellent contrast against #F8F0E3 and #A9DFBF for body text and headings.
#48C9B0 may require careful pairing for text; use it on dark backgrounds like #005953 or #008080, or with large, bold text on #F8F0E3.
Always test color combinations with accessibility tools to meet WCAG AA or AAA standards, especially for interactive elements.

Recommended combinations

Deep Forest Calm

Ideal for corporate presentations or elegant websites, using the deep green for headings, light green for subtle accents, and off-white for backgrounds.

#005953 · #A9DFBF · #F8F0E3

Vibrant Teal Flow

Excellent for energetic yet sophisticated UI elements, where teal is primary, mint is for interactive states, and the light background maintains clarity.

#008080 · #48C9B0 · #F8F0E3

Subtle Nature Blend

For softer, more organic layouts, using the light green as a dominant background element, deep green for text, and off-white for secondary backgrounds or cards.

#A9DFBF · #005953 · #F8F0E3

CSS variables

:root {
  --jade-temple-bloom-1: #005953;
  --jade-temple-bloom-2: #008080;
  --jade-temple-bloom-3: #48C9B0;
  --jade-temple-bloom-4: #A9DFBF;
  --jade-temple-bloom-5: #F8F0E3;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "jade-temple-bloom": {
        1: "#005953",
        2: "#008080",
        3: "#48C9B0",
        4: "#A9DFBF",
        5: "#F8F0E3",
      }
    }
  }
}

Hex values

Color 1#005953

Color 2#008080

Color 3#48C9B0

Color 4#A9DFBF

Color 5#F8F0E3

Accessibility

Contrast checker

1.7:1Fail

4:1AA18

5.5:1AA

7.3:1AAA

1.7:1Fail

2.3:1Fail

3.2:1AA18

4.2:1AA18

4:1AA18

2.3:1Fail

1.4:1Fail

1.8:1Fail

5.5:1AA

3.2:1AA18

1.4:1Fail

1.3:1Fail

7.3:1AAA

4.2:1AA18

1.8:1Fail

1.3:1Fail

Similar palettes

More like Jade Temple Bloom