Jade Green Color Psychology & Meaning
Jade is the imperial stone of China and Mesoamerica — these specific greens are the color of nephrite and jadeite, revered across cultures for 7,000 years as embodying virtue and permanence.
#E8F5EE
#90D8B0
#2A9A60
#0A4A28
Background
Primary Accent
Secondary
Body Text
Jade Green
richbeautifulpremium all brandingluxury
AAA
WCAG Grade
9.3:1
Contrast Ratio
2,000
Saves
5,400
AI Copies
Use #E8F5EE as background. Use #90D8B0 as primary accent. Use #2A9A60 as secondary. Use #0A4A28 as body text.
Hex Codes, RGB & CMYK Color Values
Technical breakdown for the Jade Green color scheme. Use these values for web design (HEX/RGB), print projects (CMYK), or specialized design software (HSL).
| Swatch | Design Role | HEX | RGB | CMYK | HSL |
|---|---|---|---|---|---|
| Background Luminance: 88.6% | 232, 245, 238 | 5%, 0%, 3%, 4% | 148°, 39%, 94% | ||
| Primary Accent Luminance: 58.2% | 144, 216, 176 | 33%, 0%, 19%, 15% | 147°, 48%, 71% | ||
| Secondary Luminance: 24.4% | 42, 154, 96 | 73%, 0%, 38%, 40% | 149°, 57%, 38% | ||
| Body Text Luminance: 5.1% | 10, 74, 40 | 86%, 0%, 46%, 71% | 148°, 76%, 16% |
Color Harmony: Analogous Scheme
The Jade Green palette is built using a analogous relationship between its hues. This ensures that even with high-contrast accents, the overall scheme feels balanced and intentional.
Hue Wheel
A analogous palette is often preferred by professional designers because it creates a calm, serene atmosphere by using neighboring colors.
History & Design Context
Jade has been culturally significant in Chinese, Olmec, Maya, and Maori cultures. The specific green range is immediately recognized as precious and associated with longevity and virtue.
Best Design Use Cases
Very light jade for surfaces. Soft green for cards. Rich jade for interactive. Deep forest for text.
Industries This Palette Suits
Luxury goods, Asian brands, jewelry, wellness, premium products.
How to Implement the Jade Green Color Scheme
To use this Jade Green color palette in your web project, you can copy the following CSS variables or Tailwind CSS configuration. These roles ensure your UI maintains accessibility and visual hierarchy.
Option 1: CSS Variables
:root {
/* {name} Palette - ihatecolors.com */{'
'} --color-bg: {colors[0]};{'
'} --color-primary: {colors[1]};{'
'} --color-secondary: {colors[2]};{'
'} --color-text: {colors[3]};{'
'} {'}'}Web Design Tip
Use #E8F5EE for the main background and #90D8B0 for primary buttons. This creates a high-contrast focal point.
Accessibility Note
The contrast ratio between #0A4A28 and #E8F5EE is 9.26:1 (AAA). Ensure your body text remains legible.