#7CA690 + #4ED9BD + #89E7B3 + #E4FEA5 + #F1EFDA - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#7CA690

Celadon · DarkSeaGreen · Olive Green

HEX

#7CA690

RGB

rgb(124, 166, 144)

HSL

hsl(149, 19%, 57%)

HSB

hsb(149, 25%, 65%)

CMYK

cmyk(25%, 0%, 13%, 35%)

Oklch

oklch(68.8% 0.056 161.6)

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

#4ED9BD

Mineral Blue · MediumTurquoise · Lake Green

HEX

#4ED9BD

RGB

rgb(78, 217, 189)

HSL

hsl(168, 65%, 58%)

HSB

hsb(168, 64%, 85%)

CMYK

cmyk(64%, 0%, 13%, 15%)

Oklch

oklch(80.3% 0.126 176.9)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#89E7B3

Emerald · LightGreen · Apple Green

HEX

#89E7B3

RGB

rgb(137, 231, 179)

HSL

hsl(147, 66%, 72%)

HSB

hsb(147, 41%, 91%)

CMYK

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

Oklch

oklch(85.5% 0.117 158.4)

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

#E4FEA5

Willow Green · Khaki · Mint Green

HEX

#E4FEA5

RGB

rgb(228, 254, 165)

HSL

hsl(78, 98%, 82%)

HSB

hsb(78, 35%, 100%)

CMYK

cmyk(10%, 0%, 35%, 0%)

Oklch

oklch(95.8% 0.116 121.9)

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

#F1EFDA

Fresh Green · Beige · Lemon Cream

HEX

#F1EFDA

RGB

rgb(241, 239, 218)

HSL

hsl(55, 45%, 90%)

HSB

hsb(55, 10%, 95%)

CMYK

cmyk(0%, 1%, 10%, 5%)

Oklch

oklch(94.8% 0.028 102.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7CA690

A67D92

Analogous

7DA67D

7CA690

7DA6A5

Triadic

7CA690

917DA6

A6917D

Split-Comp.

7CA690

A57DA6

A67D7D

Tetradic

7CA690

7D7DA6

A67D92

A6A57D

Contrast Matrix WCAG 2.1 Contrast

7CA690	4ED9BD	89E7B3	E4FEA5	F1EFDA
—	1.6 Fail	1.8 Fail	2.5 Fail	2.3 Fail
1.6 Fail	—	1.2 Fail	1.6 Fail	1.5 Fail
1.8 Fail	1.2 Fail	—	1.3 Fail	1.3 Fail
2.5 Fail	1.6 Fail	1.3 Fail	—	1.1 Fail
2.3 Fail	1.5 Fail	1.3 Fail	1.1 Fail	—

White BG

2.7Fail

1.8Fail

1.5Fail

1.1Fail

1.2Fail

Black BG

7.7AAA

12.0AAA

14.1AAA

19.0AAA

18.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8E8F95

8A8BC4

B2B3C0

EFEFBB

F0F0DF

Deuteranopia

8C8997

8278C5

ACA5C3

EEECC0

F0F0E0

Tritanopia

7E9A9A

55C9CA

8ECACC

E5CCCF

F1E3E4

Achromatopsia

979797

ACACAC

C5C5C5

ECECEC

EDEDED

Shades & Tints Shades & Tints

#7CA690

Dark

Light

#4ED9BD

Dark

Light

#89E7B3

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7ca690;
  --color-2: #4ed9bd;
  --color-3: #89e7b3;
  --color-4: #e4fea5;
  --color-5: #f1efda;
}

SCSS

$color-1: #7ca690;
$color-2: #4ed9bd;
$color-3: #89e7b3;
$color-4: #e4fea5;
$color-5: #f1efda;

TAILWIND

colors: {
  'brand-1': '#7ca690',
  'brand-2': '#4ed9bd',
  'brand-3': '#89e7b3',
  'brand-4': '#e4fea5',
  'brand-5': '#f1efda',
}

RGB Array

[124, 166, 144], [78, 217, 189], [137, 231, 179], [228, 254, 165], [241, 239, 218]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7CA690, #4ED9BD, #89E7B3, #E4FEA5, #F1EFDA 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: #7ca690; --color-2: #4ed9bd; --color-3: #89e7b3; --color-4: #e4fea5; --color-5: #f1efda. 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 general-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