#6DA578 + #DDE9C3 + #B2C492 + #A7A54E + #FBF432 · bright - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#6DA578

Celadon · Gray · Olive Green

HEX

#6DA578

RGB

rgb(109, 165, 120)

HSL

hsl(132, 24%, 54%)

HSB

hsb(132, 34%, 65%)

CMYK

cmyk(34%, 0%, 27%, 35%)

Oklch

oklch(67.1% 0.089 149.7)

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

#DDE9C3

Willow Green · LightGray · Mint Green

HEX

#DDE9C3

RGB

rgb(221, 233, 195)

HSL

hsl(79, 46%, 84%)

HSB

hsb(79, 16%, 91%)

CMYK

cmyk(5%, 0%, 16%, 9%)

Oklch

oklch(91.5% 0.052 121.7)

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

#B2C492

Willow Green · DarkSeaGreen · Apple Green

HEX

#B2C492

RGB

rgb(178, 196, 146)

HSL

hsl(82, 30%, 67%)

HSB

hsb(82, 26%, 77%)

CMYK

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

Oklch

oklch(79.4% 0.071 124.1)

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

#A7A54E

Autumn Sage · GoldenRod · Honey Gold

HEX

#A7A54E

RGB

rgb(167, 165, 78)

HSL

hsl(59, 36%, 48%)

HSB

hsb(59, 53%, 65%)

CMYK

cmyk(0%, 1%, 53%, 35%)

Oklch

oklch(70.5% 0.110 107.7)

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

#FBF432

Autumn Sage · Yellow · Sunflower

HEX

#FBF432

RGB

rgb(251, 244, 50)

HSL

hsl(58, 96%, 59%)

HSB

hsb(58, 80%, 98%)

CMYK

cmyk(0%, 3%, 80%, 2%)

Oklch

oklch(94.3% 0.192 107.3)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6DA578

A66E9B

Analogous

7EA66E

6DA578

6EA695

Triadic

6DA578

796EA6

A6796E

Split-Comp.

6DA578

956EA6

A66E7E

Tetradic

6DA578

6E7EA6

A66E9B

A6956E

Contrast Matrix WCAG 2.1 Contrast

6DA578	DDE9C3	B2C492	A7A54E	FBF432
—	2.3 Fail	1.5 Fail	1.1 Fail	2.5 Fail
2.3 Fail	—	1.5 Fail	2.0 Fail	1.1 Fail
1.5 Fail	1.5 Fail	—	1.4 Fail	1.6 Fail
1.1 Fail	2.0 Fail	1.4 Fail	—	2.2 Fail
2.5 Fail	1.1 Fail	1.6 Fail	2.2 Fail	—

White BG

2.9Fail

1.3Fail

1.9Fail

2.6Fail

1.2Fail

Black BG

7.3AAA

16.5AAA

11.2AAA

8.1AAA

18.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

858683

E2E2CC

BABA9E

A6A663

F8F861

Deuteranopia

827E86

E2E1CE

B9B7A1

A6A668

F8F96C

Tritanopia

708B8D

DED3D5

B3A8AA

A77477

FB868E

Achromatopsia

8F8F8F

E1E1E1

B9B9B9

9C9C9C

E0E0E0

Shades & Tints Shades & Tints

#6DA578

Dark

Light

#DDE9C3

Dark

Light

#B2C492

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6da578;
  --color-2: #dde9c3;
  --color-3: #b2c492;
  --color-4: #a7a54e;
  --color-5: #fbf432;
}

SCSS

$color-1: #6da578;
$color-2: #dde9c3;
$color-3: #b2c492;
$color-4: #a7a54e;
$color-5: #fbf432;

TAILWIND

colors: {
  'brand-1': '#6da578',
  'brand-2': '#dde9c3',
  'brand-3': '#b2c492',
  'brand-4': '#a7a54e',
  'brand-5': '#fbf432',
}

RGB Array

[109, 165, 120], [221, 233, 195], [178, 196, 146], [167, 165, 78], [251, 244, 50]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #6DA578, #DDE9C3, #B2C492, #A7A54E, #FBF432 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: #6da578; --color-2: #dde9c3; --color-3: #b2c492; --color-4: #a7a54e; --color-5: #fbf432. 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 bright-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