#7CD4B3 + #BAB39E + #F89086 + #E5B49B + #D2CDA7 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#7CD4B3

Jade · MediumAquaMarine · Apple Green

HEX

#7CD4B3

RGB

rgb(124, 212, 179)

HSL

hsl(158, 51%, 66%)

HSB

hsb(158, 42%, 83%)

CMYK

cmyk(42%, 0%, 16%, 17%)

Oklch

oklch(80.5% 0.098 167.8)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#BAB39E

Ginger · DarkGray · Sunflower

HEX

#BAB39E

RGB

rgb(186, 179, 158)

HSL

hsl(45, 17%, 67%)

HSB

hsb(45, 15%, 73%)

CMYK

cmyk(0%, 4%, 15%, 27%)

Oklch

oklch(76.7% 0.030 91.7)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#F89086

Peach Pink · LightCoral · Coral Red

HEX

#F89086

RGB

rgb(248, 144, 134)

HSL

hsl(5, 89%, 75%)

HSB

hsb(5, 46%, 97%)

CMYK

cmyk(0%, 42%, 46%, 3%)

Oklch

oklch(76.1% 0.128 26.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#E5B49B

Apricot · BurlyWood · Warm Sun

HEX

#E5B49B

RGB

rgb(229, 180, 155)

HSL

hsl(20, 59%, 75%)

HSB

hsb(20, 32%, 90%)

CMYK

cmyk(0%, 21%, 32%, 10%)

Oklch

oklch(80.8% 0.067 48.4)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#D2CDA7

Fresh Green · Silver · Sunflower

HEX

#D2CDA7

RGB

rgb(210, 205, 167)

HSL

hsl(53, 32%, 74%)

HSB

hsb(53, 20%, 82%)

CMYK

cmyk(0%, 2%, 20%, 18%)

Oklch

oklch(84.3% 0.051 101.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7CD4B3

D57C9D

Analogous

7CD588

7CD4B3

7CC9D5

Triadic

7CD4B3

B47CD5

D5B47C

Split-Comp.

7CD4B3

D57CC9

D5887C

Tetradic

7CD4B3

887CD5

D57C9D

C9D57C

Contrast Matrix WCAG 2.1 Contrast

7CD4B3	BAB39E	F89086	E5B49B	D2CDA7
—	1.2 Fail	1.3 Fail	1.1 Fail	1.1 Fail
1.2 Fail	—	1.1 Fail	1.1 Fail	1.3 Fail
1.3 Fail	1.1 Fail	—	1.2 Fail	1.4 Fail
1.1 Fail	1.1 Fail	1.2 Fail	—	1.1 Fail
1.1 Fail	1.3 Fail	1.4 Fail	1.1 Fail	—

White BG

1.8Fail

2.1Fail

2.3Fail

1.9Fail

1.6Fail

Black BG

11.9AAA

10.0AAA

9.3AAA

11.3AAA

13.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A2A3BB

B7B7A3

CBCA88

D0CFA1

D0D0B0

Deuteranopia

9D96BD

B7B8A4

D1D989

D3D6A3

D0D1B2

Tritanopia

80C1C3

BAA7A8

F38A8B

E3A6A7

D2B7B9

Achromatopsia

B6B6B6

B3B3B3

AEAEAE

C0C0C0

CACACA

Shades & Tints Shades & Tints

#7CD4B3

Dark

Light

#BAB39E

Dark

Light

#F89086

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7cd4b3;
  --color-2: #bab39e;
  --color-3: #f89086;
  --color-4: #e5b49b;
  --color-5: #d2cda7;
}

SCSS

$color-1: #7cd4b3;
$color-2: #bab39e;
$color-3: #f89086;
$color-4: #e5b49b;
$color-5: #d2cda7;

TAILWIND

colors: {
  'brand-1': '#7cd4b3',
  'brand-2': '#bab39e',
  'brand-3': '#f89086',
  'brand-4': '#e5b49b',
  'brand-5': '#d2cda7',
}

RGB Array

[124, 212, 179], [186, 179, 158], [248, 144, 134], [229, 180, 155], [210, 205, 167]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7CD4B3, #BAB39E, #F89086, #E5B49B, #D2CDA7 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: #7cd4b3; --color-2: #bab39e; --color-3: #f89086; --color-4: #e5b49b; --color-5: #d2cda7. 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