#B39E67 + #81C0B7 + #9BD3B8 + #C9D3A1 + #E3D690 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#B39E67

Ginger · Tan · Sunflower

HEX

#B39E67

RGB

rgb(179, 158, 103)

HSL

hsl(43, 33%, 55%)

HSB

hsb(43, 42%, 70%)

CMYK

cmyk(0%, 12%, 42%, 30%)

Oklch

oklch(70.5% 0.077 89.4)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#81C0B7

Jade · MediumAquaMarine · Lake Green

HEX

#81C0B7

RGB

rgb(129, 192, 183)

HSL

hsl(171, 33%, 63%)

HSB

hsb(171, 33%, 75%)

CMYK

cmyk(33%, 0%, 5%, 25%)

Oklch

oklch(76.3% 0.066 184.7)

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

#9BD3B8

Jade · Silver · Apple Green

HEX

#9BD3B8

RGB

rgb(155, 211, 184)

HSL

hsl(151, 39%, 72%)

HSB

hsb(151, 27%, 83%)

CMYK

cmyk(27%, 0%, 13%, 17%)

Oklch

oklch(82.1% 0.069 163.6)

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

#C9D3A1

Willow Green · Silver · Apple Green

HEX

#C9D3A1

RGB

rgb(201, 211, 161)

HSL

hsl(72, 36%, 73%)

HSB

hsb(72, 24%, 83%)

CMYK

cmyk(5%, 0%, 24%, 17%)

Oklch

oklch(84.7% 0.067 117.1)

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

#E3D690

Fresh Green · Khaki · Sunflower

HEX

#E3D690

RGB

rgb(227, 214, 144)

HSL

hsl(51, 60%, 73%)

HSB

hsb(51, 37%, 89%)

CMYK

cmyk(0%, 6%, 37%, 11%)

Oklch

oklch(87.1% 0.090 99.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B39E67

667CB2

Analogous

B27766

B39E67

A2B266

Triadic

B39E67

66B29D

9D66B2

Split-Comp.

B39E67

66A2B2

7766B2

Tetradic

B39E67

66B277

667CB2

B266A2

Contrast Matrix WCAG 2.1 Contrast

B39E67	81C0B7	9BD3B8	C9D3A1	E3D690
—	1.3 Fail	1.5 Fail	1.7 Fail	1.8 Fail
1.3 Fail	—	1.2 Fail	1.3 Fail	1.4 Fail
1.5 Fail	1.2 Fail	—	1.1 Fail	1.2 Fail
1.7 Fail	1.3 Fail	1.1 Fail	—	1.1 Fail
1.8 Fail	1.4 Fail	1.2 Fail	1.1 Fail	—

White BG

2.6Fail

2.1Fail

1.7Fail

1.6Fail

1.5Fail

Black BG

8.0AAA

10.2AAA

12.4AAA

13.3AAA

14.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

AAAA74

9C9DB9

B3B4BF

CDCDAD

DDDDA1

Deuteranopia

ABAD78

9994BA

B0ACC0

CDCCB0

DEDFA5

Tritanopia

B27F81

84BBBB

9EC4C5

CAB7B9

E2AEB1

Achromatopsia

9E9E9E

ACACAC

BFBFBF

CACACA

D2D2D2

Shades & Tints Shades & Tints

#B39E67

Dark

Light

#81C0B7

Dark

Light

#9BD3B8

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b39e67;
  --color-2: #81c0b7;
  --color-3: #9bd3b8;
  --color-4: #c9d3a1;
  --color-5: #e3d690;
}

SCSS

$color-1: #b39e67;
$color-2: #81c0b7;
$color-3: #9bd3b8;
$color-4: #c9d3a1;
$color-5: #e3d690;

TAILWIND

colors: {
  'brand-1': '#b39e67',
  'brand-2': '#81c0b7',
  'brand-3': '#9bd3b8',
  'brand-4': '#c9d3a1',
  'brand-5': '#e3d690',
}

RGB Array

[179, 158, 103], [129, 192, 183], [155, 211, 184], [201, 211, 161], [227, 214, 144]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B39E67, #81C0B7, #9BD3B8, #C9D3A1, #E3D690 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: #b39e67; --color-2: #81c0b7; --color-3: #9bd3b8; --color-4: #c9d3a1; --color-5: #e3d690. 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