#C4CEC3 + #F6E8CD + #DCBCA7 + #E0A9A4 + #956767 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C4CEC3

Celadon · Silver · Apple Green

HEX

#C4CEC3

RGB

rgb(196, 206, 195)

HSL

hsl(115, 10%, 79%)

HSB

hsb(115, 5%, 81%)

CMYK

cmyk(5%, 0%, 5%, 19%)

Oklch

oklch(84.1% 0.019 142.8)

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

#F6E8CD

Goose Yellow · Bisque · Lemon Cream

HEX

#F6E8CD

RGB

rgb(246, 232, 205)

HSL

hsl(40, 69%, 88%)

HSB

hsb(40, 17%, 96%)

CMYK

cmyk(0%, 6%, 17%, 4%)

Oklch

oklch(93.5% 0.039 83.8)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#DCBCA7

Apricot · Tan · Peach Orange

HEX

#DCBCA7

RGB

rgb(220, 188, 167)

HSL

hsl(24, 43%, 76%)

HSB

hsb(24, 24%, 86%)

CMYK

cmyk(0%, 15%, 24%, 14%)

Oklch

oklch(81.7% 0.047 55.2)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#E0A9A4

Peach Pink · Tan · Coral Red

HEX

#E0A9A4

RGB

rgb(224, 169, 164)

HSL

hsl(5, 49%, 76%)

HSB

hsb(5, 27%, 88%)

CMYK

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

Oklch

oklch(78.4% 0.066 24.6)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#956767

Crimson · Gray · Passion Red

HEX

#956767

RGB

rgb(149, 103, 103)

HSL

hsl(0, 18%, 49%)

HSB

hsb(0, 31%, 58%)

CMYK

cmyk(0%, 31%, 31%, 42%)

Oklch

oklch(56.2% 0.060 19.1)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C4CEC3

CEC4CF

Analogous

CACFC4

C4CEC3

C4CFC9

Triadic

C4CEC3

C4C5CF

CFC4C5

Split-Comp.

C4CEC3

C9C4CF

CFC4CA

Tetradic

C4CEC3

C4CACF

CEC4CF

CFC9C4

Contrast Matrix WCAG 2.1 Contrast

C4CEC3	F6E8CD	DCBCA7	E0A9A4	956767
—	1.3 Fail	1.1 Fail	1.2 Fail	2.9 Fail
1.3 Fail	—	1.5 Fail	1.7 Fail	3.9 AA Large
1.1 Fail	1.5 Fail	—	1.1 Fail	2.7 Fail
1.2 Fail	1.7 Fail	1.1 Fail	—	2.4 Fail
2.9 Fail	3.9 AA Large	2.7 Fail	2.4 Fail	—

White BG

1.6Fail

1.2Fail

1.8Fail

2.0Fail

4.8AA

Black BG

13.0AAA

17.3AAA

11.8AAA

10.4AAA

4.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

C8C8C6

F0F0D4

CECEAC

C8C8A5

818167

Deuteranopia

C8C7C6

F1F2D5

D0D2AD

CBCFA6

848767

Tritanopia

C5C8C8

F5D9DA

DAB0B1

DDA6A6

936767

Achromatopsia

CACACA

E9E9E9

C3C3C3

B9B9B9

757575

Shades & Tints Shades & Tints

#C4CEC3

Dark

Light

#F6E8CD

Dark

Light

#DCBCA7

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c4cec3;
  --color-2: #f6e8cd;
  --color-3: #dcbca7;
  --color-4: #e0a9a4;
  --color-5: #956767;
}

SCSS

$color-1: #c4cec3;
$color-2: #f6e8cd;
$color-3: #dcbca7;
$color-4: #e0a9a4;
$color-5: #956767;

TAILWIND

colors: {
  'brand-1': '#c4cec3',
  'brand-2': '#f6e8cd',
  'brand-3': '#dcbca7',
  'brand-4': '#e0a9a4',
  'brand-5': '#956767',
}

RGB Array

[196, 206, 195], [246, 232, 205], [220, 188, 167], [224, 169, 164], [149, 103, 103]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C4CEC3, #F6E8CD, #DCBCA7, #E0A9A4, #956767 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: #c4cec3; --color-2: #f6e8cd; --color-3: #dcbca7; --color-4: #e0a9a4; --color-5: #956767. 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