#D4E0C4 + #BDC242 + #B34566 + #CC6D1F + #ADB99E - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#D4E0C4

Willow Green · LightGray · Mint Green

HEX

#D4E0C4

RGB

rgb(212, 224, 196)

HSL

hsl(86, 31%, 82%)

HSB

hsb(86, 12%, 88%)

CMYK

cmyk(5%, 0%, 12%, 12%)

Oklch

oklch(89.0% 0.040 126.2)

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

#BDC242

Autumn Sage · GoldenRod · Sunflower

HEX

#BDC242

RGB

rgb(189, 194, 66)

HSL

hsl(62, 51%, 51%)

HSB

hsb(62, 66%, 76%)

CMYK

cmyk(3%, 0%, 66%, 24%)

Oklch

oklch(78.7% 0.148 111.5)

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

#B34566

Dark Violet · MediumVioletRed · Camellia

HEX

#B34566

RGB

rgb(179, 69, 102)

HSL

hsl(342, 44%, 49%)

HSB

hsb(342, 61%, 70%)

CMYK

cmyk(0%, 61%, 43%, 30%)

Oklch

oklch(54.8% 0.146 4.6)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#CC6D1F

Tangerine · Chocolate · Amber Brown

HEX

#CC6D1F

RGB

rgb(204, 109, 31)

HSL

hsl(27, 74%, 46%)

HSB

hsb(27, 85%, 80%)

CMYK

cmyk(0%, 47%, 85%, 20%)

Oklch

oklch(63.2% 0.146 53.9)

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

#ADB99E

Willow Green · DarkGray · Apple Green

HEX

#ADB99E

RGB

rgb(173, 185, 158)

HSL

hsl(87, 16%, 67%)

HSB

hsb(87, 15%, 73%)

CMYK

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

Oklch

oklch(76.9% 0.040 126.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D4E0C4

CFC3DF

Analogous

DFDDC3

D4E0C4

C5DFC3

Triadic

D4E0C4

C3D3DF

DFC3D3

Split-Comp.

D4E0C4

C3C5DF

DDC3DF

Tetradic

D4E0C4

C3DFDD

CFC3DF

DFC3C5

Contrast Matrix WCAG 2.1 Contrast

D4E0C4	BDC242	B34566	CC6D1F	ADB99E
—	1.4 Fail	3.9 AA Large	2.6 Fail	1.5 Fail
1.4 Fail	—	2.8 Fail	1.9 Fail	1.1 Fail
3.9 AA Large	2.8 Fail	—	1.5 Fail	2.6 Fail
2.6 Fail	1.9 Fail	1.5 Fail	—	1.8 Fail
1.5 Fail	1.1 Fail	2.6 Fail	1.8 Fail	—

White BG

1.4Fail

1.9Fail

5.3AA

3.6AA Large

2.1Fail

Black BG

15.3AAA

11.0AAA

4.0AA Large

5.8AA

10.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D9D9CB

BFBF61

83825E

A3A232

B2B2A5

Deuteranopia

D9D8CC

BFBE68

8A925C

A8AF36

B2B1A6

Tritanopia

D5D0D1

BD797F

AD5856

C74144

AEAAAB

Achromatopsia

D9D9D9

B2B2B2

6A6A6A

818181

B2B2B2

Shades & Tints Shades & Tints

#D4E0C4

Dark

Light

#BDC242

Dark

Light

#B34566

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d4e0c4;
  --color-2: #bdc242;
  --color-3: #b34566;
  --color-4: #cc6d1f;
  --color-5: #adb99e;
}

SCSS

$color-1: #d4e0c4;
$color-2: #bdc242;
$color-3: #b34566;
$color-4: #cc6d1f;
$color-5: #adb99e;

TAILWIND

colors: {
  'brand-1': '#d4e0c4',
  'brand-2': '#bdc242',
  'brand-3': '#b34566',
  'brand-4': '#cc6d1f',
  'brand-5': '#adb99e',
}

RGB Array

[212, 224, 196], [189, 194, 66], [179, 69, 102], [204, 109, 31], [173, 185, 158]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D4E0C4, #BDC242, #B34566, #CC6D1F, #ADB99E 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: #d4e0c4; --color-2: #bdc242; --color-3: #b34566; --color-4: #cc6d1f; --color-5: #adb99e. 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