#C7B281 + #E6DE8E + #F7F4B1 + #9CD9BC + #7FB8B5 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C7B281

Ginger · Tan · Sunflower

HEX

#C7B281

RGB

rgb(199, 178, 129)

HSL

hsl(42, 38%, 64%)

HSB

hsb(42, 35%, 78%)

CMYK

cmyk(0%, 11%, 35%, 22%)

Oklch

oklch(77.0% 0.069 87.4)

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

#E6DE8E

Fresh Green · Khaki · Sunflower

HEX

#E6DE8E

RGB

rgb(230, 222, 142)

HSL

hsl(55, 64%, 73%)

HSB

hsb(55, 38%, 90%)

CMYK

cmyk(0%, 3%, 38%, 10%)

Oklch

oklch(88.9% 0.101 103.3)

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

#F7F4B1

Fresh Green · Wheat · Lemon Cream

HEX

#F7F4B1

RGB

rgb(247, 244, 177)

HSL

hsl(57, 81%, 83%)

HSB

hsb(57, 28%, 97%)

CMYK

cmyk(0%, 1%, 28%, 3%)

Oklch

oklch(95.4% 0.085 105.7)

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

#9CD9BC

Jade · Silver · Apple Green

HEX

#9CD9BC

RGB

rgb(156, 217, 188)

HSL

hsl(151, 45%, 73%)

HSB

hsb(151, 28%, 85%)

CMYK

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

Oklch

oklch(83.6% 0.075 163.7)

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

#7FB8B5

Jade · MediumAquaMarine · Lake Green

HEX

#7FB8B5

RGB

rgb(127, 184, 181)

HSL

hsl(177, 29%, 61%)

HSB

hsb(177, 31%, 72%)

CMYK

cmyk(31%, 0%, 2%, 28%)

Oklch

oklch(74.2% 0.059 191.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C7B281

8095C6

Analogous

C68E80

C7B281

B8C680

Triadic

C7B281

80C6B1

B180C6

Split-Comp.

C7B281

80B8C6

8E80C6

Tetradic

C7B281

80C68E

8095C6

C680B8

Contrast Matrix WCAG 2.1 Contrast

C7B281	E6DE8E	F7F4B1	9CD9BC	7FB8B5
—	1.5 Fail	1.8 Fail	1.3 Fail	1.1 Fail
1.5 Fail	—	1.2 Fail	1.2 Fail	1.6 Fail
1.8 Fail	1.2 Fail	—	1.4 Fail	2.0 Fail
1.3 Fail	1.2 Fail	1.4 Fail	—	1.4 Fail
1.1 Fail	1.6 Fail	2.0 Fail	1.4 Fail	—

White BG

2.1Fail

1.4Fail

1.1Fail

1.6Fail

2.2Fail

Black BG

10.1AAA

15.2AAA

18.5AAA

13.1AAA

9.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BEBE8D

E3E2A1

F6F6C1

B6B7C3

9898B6

Deuteranopia

BFC190

E3E4A6

F6F6C5

B3AEC5

9490B6

Tritanopia

C69698

E6B1B4

F7CED1

9FC9CA

82B6B6

Achromatopsia

B3B3B3

D7D7D7

EDEDED

C3C3C3

A7A7A7

Shades & Tints Shades & Tints

#C7B281

Dark

Light

#E6DE8E

Dark

Light

#F7F4B1

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c7b281;
  --color-2: #e6de8e;
  --color-3: #f7f4b1;
  --color-4: #9cd9bc;
  --color-5: #7fb8b5;
}

SCSS

$color-1: #c7b281;
$color-2: #e6de8e;
$color-3: #f7f4b1;
$color-4: #9cd9bc;
$color-5: #7fb8b5;

TAILWIND

colors: {
  'brand-1': '#c7b281',
  'brand-2': '#e6de8e',
  'brand-3': '#f7f4b1',
  'brand-4': '#9cd9bc',
  'brand-5': '#7fb8b5',
}

RGB Array

[199, 178, 129], [230, 222, 142], [247, 244, 177], [156, 217, 188], [127, 184, 181]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C7B281, #E6DE8E, #F7F4B1, #9CD9BC, #7FB8B5 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: #c7b281; --color-2: #e6de8e; --color-3: #f7f4b1; --color-4: #9cd9bc; --color-5: #7fb8b5. 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