#E75788 + #748D7A + #AABE99 + #C7D099 + #E7E4BB · nature - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarm

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#E75788

Rouge · LightCoral · Rose Pink

HEX

#E75788

RGB

rgb(231, 87, 136)

HSL

hsl(340, 75%, 62%)

HSB

hsb(340, 62%, 91%)

CMYK

cmyk(0%, 62%, 41%, 9%)

Oklch

oklch(65.9% 0.183 2.5)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#748D7A

Celadon · Gray · Olive Green

HEX

#748D7A

RGB

rgb(116, 141, 122)

HSL

hsl(134, 10%, 50%)

HSB

hsb(134, 18%, 55%)

CMYK

cmyk(18%, 0%, 13%, 45%)

Oklch

oklch(61.8% 0.040 152.4)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#AABE99

Celadon · DarkGray · Apple Green

HEX

#AABE99

RGB

rgb(170, 190, 153)

HSL

hsl(92, 22%, 67%)

HSB

hsb(92, 19%, 75%)

CMYK

cmyk(11%, 0%, 19%, 25%)

Oklch

oklch(77.6% 0.056 130.8)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#C7D099

Willow Green · Tan · Apple Green

HEX

#C7D099

RGB

rgb(199, 208, 153)

HSL

hsl(70, 37%, 71%)

HSB

hsb(70, 26%, 82%)

CMYK

cmyk(4%, 0%, 26%, 18%)

Oklch

oklch(83.7% 0.074 115.6)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#E7E4BB

Fresh Green · Wheat · Lemon Cream

HEX

#E7E4BB

RGB

rgb(231, 228, 187)

HSL

hsl(56, 48%, 82%)

HSB

hsb(56, 19%, 91%)

CMYK

cmyk(0%, 1%, 19%, 9%)

Oklch

oklch(91.1% 0.054 104.0)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E75788

55E7B6

Analogous

E755CF

E75788

E76E55

Triadic

E75788

86E755

5586E7

Split-Comp.

E75788

55E76E

55CFE7

Tetradic

E75788

CFE755

55E7B6

6E55E7

Contrast Matrix WCAG 2.1 Contrast

E75788	748D7A	AABE99	C7D099	E7E4BB
—	1.0 Fail	1.7 Fail	2.1 Fail	2.7 Fail
1.0 Fail	—	1.8 Fail	2.2 Fail	2.8 Fail
1.7 Fail	1.8 Fail	—	1.2 Fail	1.5 Fail
2.1 Fail	2.2 Fail	1.2 Fail	—	1.3 Fail
2.7 Fail	2.8 Fail	1.5 Fail	1.3 Fail	—

White BG

3.4AA Large

3.6AA Large

2.0Fail

1.6Fail

1.3Fail

Black BG

6.1AA

5.8AA

10.5AAA

12.9AAA

16.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A9A77C

7F7F7F

B3B3A2

CBCBA6

E6E6C5

Deuteranopia

B1BC79

7D7B80

B2B0A4

CACAAA

E6E6C7

Tritanopia

E07371

758283

ABA9AB

C7B1B3

E7CDCE

Achromatopsia

888888

838383

B4B4B4

C7C7C7

E0E0E0

Shades & Tints Shades & Tints

#E75788

Dark

Light

#748D7A

Dark

Light

#AABE99

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e75788;
  --color-2: #748d7a;
  --color-3: #aabe99;
  --color-4: #c7d099;
  --color-5: #e7e4bb;
}

SCSS

$color-1: #e75788;
$color-2: #748d7a;
$color-3: #aabe99;
$color-4: #c7d099;
$color-5: #e7e4bb;

TAILWIND

colors: {
  'brand-1': '#e75788',
  'brand-2': '#748d7a',
  'brand-3': '#aabe99',
  'brand-4': '#c7d099',
  'brand-5': '#e7e4bb',
}

RGB Array

[231, 87, 136], [116, 141, 122], [170, 190, 153], [199, 208, 153], [231, 228, 187]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #E75788, #748D7A, #AABE99, #C7D099, #E7E4BB is ideal for: health products, baby brands, fresh-style blogs. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #e75788; --color-2: #748d7a; --color-3: #aabe99; --color-4: #c7d099; --color-5: #e7e4bb. LangColor editor supports one-click export to CSS, SCSS, Tailwind, JSON and more. Click the "Export" button to choose your format.

What UI/UX design tips apply to this palette?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. Use the "Contrast Matrix" tool in LangColor editor to check WCAG accessibility levels for every color pair.

Which industries or brands suit this palette?

This nature-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. Click "AI Analysis" in the editor for more detailed brand color suggestions.

🎨 Open this palette in Editor →

Generated by LangColor online color tool · Breaking the barrier between language and color