#C4BA58 + #DEA364 + #BFB9C0 + #A5D1C4 + #DADECC - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C4BA58

Autumn Sage · SandyBrown · Sunflower

HEX

#C4BA58

RGB

rgb(196, 186, 88)

HSL

hsl(54, 48%, 56%)

HSB

hsb(54, 55%, 77%)

CMYK

cmyk(0%, 5%, 55%, 23%)

Oklch

oklch(77.7% 0.120 103.5)

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

#DEA364

Ginger · SandyBrown · Warm Sun

HEX

#DEA364

RGB

rgb(222, 163, 100)

HSL

hsl(31, 65%, 63%)

HSB

hsb(31, 55%, 87%)

CMYK

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

Oklch

oklch(75.8% 0.106 66.9)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#BFB9C0

Silver Gray · Silver · Pearl Gray

HEX

#BFB9C0

RGB

rgb(191, 185, 192)

HSL

hsl(291, 5%, 74%)

HSB

hsb(291, 4%, 75%)

CMYK

cmyk(1%, 4%, 0%, 25%)

Oklch

oklch(79.3% 0.012 321.3)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

#A5D1C4

Jade · LightSteelBlue · Lake Green

HEX

#A5D1C4

RGB

rgb(165, 209, 196)

HSL

hsl(162, 32%, 73%)

HSB

hsb(162, 21%, 82%)

CMYK

cmyk(21%, 0%, 6%, 18%)

Oklch

oklch(82.6% 0.050 175.1)

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

#DADECC

Willow Green · LightGray · Mint Green

HEX

#DADECC

RGB

rgb(218, 222, 204)

HSL

hsl(73, 21%, 84%)

HSB

hsb(73, 8%, 87%)

CMYK

cmyk(2%, 0%, 8%, 13%)

Oklch

oklch(89.3% 0.025 117.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C4BA58

5964C5

Analogous

C58459

C4BA58

9AC559

Triadic

C4BA58

59C5BA

BA59C5

Split-Comp.

C4BA58

599AC5

8459C5

Tetradic

C4BA58

59C584

5964C5

C5599A

Contrast Matrix WCAG 2.1 Contrast

C4BA58	DEA364	BFB9C0	A5D1C4	DADECC
—	1.1 Fail	1.0 Fail	1.2 Fail	1.5 Fail
1.1 Fail	—	1.1 Fail	1.3 Fail	1.6 Fail
1.0 Fail	1.1 Fail	—	1.1 Fail	1.4 Fail
1.2 Fail	1.3 Fail	1.1 Fail	—	1.2 Fail
1.5 Fail	1.6 Fail	1.4 Fail	1.2 Fail	—

White BG

2.0Fail

2.2Fail

1.9Fail

1.7Fail

1.4Fail

Black BG

10.5AAA

9.5AAA

10.9AAA

12.5AAA

15.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C0C070

C4C473

BCBCBE

B8B8C7

DCDCD0

Deuteranopia

C0C175

C8CC77

BDBDBE

B6B2C8

DCDBD1

Tritanopia

C48287

DB7F82

BFBDBD

A7CACA

DAD4D5

Achromatopsia

B2B2B2

ADADAD

BCBCBC

C2C2C2

DBDBDB

Shades & Tints Shades & Tints

#C4BA58

Dark

Light

#DEA364

Dark

Light

#BFB9C0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c4ba58;
  --color-2: #dea364;
  --color-3: #bfb9c0;
  --color-4: #a5d1c4;
  --color-5: #dadecc;
}

SCSS

$color-1: #c4ba58;
$color-2: #dea364;
$color-3: #bfb9c0;
$color-4: #a5d1c4;
$color-5: #dadecc;

TAILWIND

colors: {
  'brand-1': '#c4ba58',
  'brand-2': '#dea364',
  'brand-3': '#bfb9c0',
  'brand-4': '#a5d1c4',
  'brand-5': '#dadecc',
}

RGB Array

[196, 186, 88], [222, 163, 100], [191, 185, 192], [165, 209, 196], [218, 222, 204]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C4BA58, #DEA364, #BFB9C0, #A5D1C4, #DADECC 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: #c4ba58; --color-2: #dea364; --color-3: #bfb9c0; --color-4: #a5d1c4; --color-5: #dadecc. 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