#6D6153 + #F4D105 + #E6F78F + #BCD59B + #7EC8AF - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#6D6153

Ochre · DimGray · Amber Brown

HEX

#6D6153

RGB

rgb(109, 97, 83)

HSL

hsl(32, 14%, 38%)

HSB

hsb(32, 24%, 43%)

CMYK

cmyk(0%, 11%, 24%, 57%)

Oklch

oklch(50.0% 0.026 71.4)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#F4D105

Autumn Sage · Gold · Honey Gold

HEX

#F4D105

RGB

rgb(244, 209, 5)

HSL

hsl(51, 96%, 49%)

HSB

hsb(51, 98%, 96%)

CMYK

cmyk(0%, 14%, 98%, 4%)

Oklch

oklch(86.4% 0.178 96.8)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#E6F78F

Willow Green · Khaki · Apple Green

HEX

#E6F78F

RGB

rgb(230, 247, 143)

HSL

hsl(70, 87%, 76%)

HSB

hsb(70, 42%, 97%)

CMYK

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

Oklch

oklch(94.1% 0.130 116.6)

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

#BCD59B

Willow Green · Tan · Apple Green

HEX

#BCD59B

RGB

rgb(188, 213, 155)

HSL

hsl(86, 41%, 72%)

HSB

hsb(86, 27%, 84%)

CMYK

cmyk(12%, 0%, 27%, 16%)

Oklch

oklch(84.0% 0.082 127.0)

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

#7EC8AF

Jade · MediumAquaMarine · Lake Green

HEX

#7EC8AF

RGB

rgb(126, 200, 175)

HSL

hsl(160, 40%, 64%)

HSB

hsb(160, 37%, 78%)

CMYK

cmyk(37%, 0%, 12%, 22%)

Oklch

oklch(77.7% 0.083 170.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6D6153

53606E

Analogous

6E5453

6D6153

6E6E53

Triadic

6D6153

536E62

62536E

Split-Comp.

6D6153

536E6E

54536E

Tetradic

6D6153

536E54

53606E

6E536E

Contrast Matrix WCAG 2.1 Contrast

6D6153	F4D105	E6F78F	BCD59B	7EC8AF
—	4.0 AA Large	5.2 AA	3.8 AA Large	3.1 AA Large
4.0 AA Large	—	1.3 Fail	1.1 Fail	1.3 Fail
5.2 AA	1.3 Fail	—	1.4 Fail	1.7 Fail
3.8 AA Large	1.1 Fail	1.4 Fail	—	1.2 Fail
3.1 AA Large	1.3 Fail	1.7 Fail	1.2 Fail	—

White BG

6.0AA

1.5Fail

1.2Fail

1.6Fail

2.0Fail

Black BG

3.5AA Large

14.0AAA

18.1AAA

13.1AAA

10.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

686856

E5E536

EDEEA8

C7C7A9

9E9FB5

Deuteranopia

696957

E7E942

ECEBAE

C5C4AC

9A94B7

Tritanopia

6C595A

F25D66

E7BCC0

BDB4B7

82BABB

Achromatopsia

636363

C4C4C4

E6E6E6

C7C7C7

AFAFAF

Shades & Tints Shades & Tints

#6D6153

Dark

Light

#F4D105

Dark

Light

#E6F78F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6d6153;
  --color-2: #f4d105;
  --color-3: #e6f78f;
  --color-4: #bcd59b;
  --color-5: #7ec8af;
}

SCSS

$color-1: #6d6153;
$color-2: #f4d105;
$color-3: #e6f78f;
$color-4: #bcd59b;
$color-5: #7ec8af;

TAILWIND

colors: {
  'brand-1': '#6d6153',
  'brand-2': '#f4d105',
  'brand-3': '#e6f78f',
  'brand-4': '#bcd59b',
  'brand-5': '#7ec8af',
}

RGB Array

[109, 97, 83], [244, 209, 5], [230, 247, 143], [188, 213, 155], [126, 200, 175]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #6D6153, #F4D105, #E6F78F, #BCD59B, #7EC8AF is ideal for: corporate websites, product showcases, portfolios. 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: #6d6153; --color-2: #f4d105; --color-3: #e6f78f; --color-4: #bcd59b; --color-5: #7ec8af. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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