#C1B2B0 + #EFE7DC + #DDD2B2 + #EDF0F5 + #F7F6CC - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C1B2B0

Peach Pink · Silver · Coral Red

HEX

#C1B2B0

RGB

rgb(193, 178, 176)

HSL

hsl(7, 12%, 72%)

HSB

hsb(7, 9%, 76%)

CMYK

cmyk(0%, 8%, 9%, 24%)

Oklch

oklch(77.6% 0.017 26.7)

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

#EFE7DC

Goose Yellow · Beige · Peach Orange

HEX

#EFE7DC

RGB

rgb(239, 231, 220)

HSL

hsl(35, 37%, 90%)

HSB

hsb(35, 8%, 94%)

CMYK

cmyk(0%, 3%, 8%, 6%)

Oklch

oklch(93.1% 0.017 76.1)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#DDD2B2

Goose Yellow · Wheat · Lemon Cream

HEX

#DDD2B2

RGB

rgb(221, 210, 178)

HSL

hsl(45, 39%, 78%)

HSB

hsb(45, 19%, 87%)

CMYK

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

Oklch

oklch(86.4% 0.044 91.3)

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

#EDF0F5

Azure · Lavender · Sky Blue

HEX

#EDF0F5

RGB

rgb(237, 240, 245)

HSL

hsl(218, 29%, 95%)

HSB

hsb(218, 3%, 96%)

CMYK

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

Oklch

oklch(95.4% 0.007 260.7)

Traditional「Azure」· Paint「Sky Blue」· Creative Twilight Haze

#F7F6CC

Fresh Green · Beige · Lemon Cream

HEX

#F7F6CC

RGB

rgb(247, 246, 204)

HSL

hsl(59, 73%, 88%)

HSB

hsb(59, 17%, 97%)

CMYK

cmyk(0%, 0%, 17%, 3%)

Oklch

oklch(96.3% 0.054 106.3)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C1B2B0

AFBEC0

Analogous

C0AFB6

C1B2B0

C0BAAF

Triadic

C1B2B0

AFC0B1

B1AFC0

Split-Comp.

C1B2B0

AFC0BA

AFB6C0

Tetradic

C1B2B0

B6C0AF

AFBEC0

BAAFC0

Contrast Matrix WCAG 2.1 Contrast

C1B2B0	EFE7DC	DDD2B2	EDF0F5	F7F6CC
—	1.7 Fail	1.4 Fail	1.8 Fail	1.9 Fail
1.7 Fail	—	1.2 Fail	1.1 Fail	1.1 Fail
1.4 Fail	1.2 Fail	—	1.3 Fail	1.4 Fail
1.8 Fail	1.1 Fail	1.3 Fail	—	1.0 Fail
1.9 Fail	1.1 Fail	1.4 Fail	1.0 Fail	—

White BG

2.0Fail

1.2Fail

1.5Fail

1.1Fail

Black BG

10.3AAA

17.1AAA

13.9AAA

18.4AAA

19.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BBBAB0

ECEBDF

D8D8BA

EEEEF4

F7F7D6

Deuteranopia

BBBDB1

ECEDDF

D9DABC

EEEEF4

F7F7D9

Tritanopia

C0B1B1

EFE1E1

DCC0C1

EDF3F3

F7DEE0

Achromatopsia

B6B6B6

E8E8E8

D2D2D2

F0F0F0

F2F2F2

Shades & Tints Shades & Tints

#C1B2B0

Dark

Light

#EFE7DC

Dark

Light

#DDD2B2

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c1b2b0;
  --color-2: #efe7dc;
  --color-3: #ddd2b2;
  --color-4: #edf0f5;
  --color-5: #f7f6cc;
}

SCSS

$color-1: #c1b2b0;
$color-2: #efe7dc;
$color-3: #ddd2b2;
$color-4: #edf0f5;
$color-5: #f7f6cc;

TAILWIND

colors: {
  'brand-1': '#c1b2b0',
  'brand-2': '#efe7dc',
  'brand-3': '#ddd2b2',
  'brand-4': '#edf0f5',
  'brand-5': '#f7f6cc',
}

RGB Array

[193, 178, 176], [239, 231, 220], [221, 210, 178], [237, 240, 245], [247, 246, 204]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C1B2B0, #EFE7DC, #DDD2B2, #EDF0F5, #F7F6CC 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: #c1b2b0; --color-2: #efe7dc; --color-3: #ddd2b2; --color-4: #edf0f5; --color-5: #f7f6cc. 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