#C7E1DC + #C2CCA4 + #D5AE92 + #EF7587 + #865B69 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C7E1DC

Jade · LightGray · Glacier Blue

HEX

#C7E1DC

RGB

rgb(199, 225, 220)

HSL

hsl(168, 30%, 83%)

HSB

hsb(168, 12%, 88%)

CMYK

cmyk(12%, 0%, 2%, 12%)

Oklch

oklch(88.9% 0.028 182.8)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#C2CCA4

Willow Green · Silver · Apple Green

HEX

#C2CCA4

RGB

rgb(194, 204, 164)

HSL

hsl(75, 28%, 72%)

HSB

hsb(75, 20%, 80%)

CMYK

cmyk(5%, 0%, 20%, 20%)

Oklch

oklch(82.7% 0.055 119.0)

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

#D5AE92

Apricot · Tan · Warm Sun

HEX

#D5AE92

RGB

rgb(213, 174, 146)

HSL

hsl(25, 44%, 70%)

HSB

hsb(25, 31%, 84%)

CMYK

cmyk(0%, 18%, 31%, 16%)

Oklch

oklch(77.9% 0.060 57.4)

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

#EF7587

Peach Pink · LightCoral · Coral Red

HEX

#EF7587

RGB

rgb(239, 117, 135)

HSL

hsl(351, 79%, 70%)

HSB

hsb(351, 51%, 94%)

CMYK

cmyk(0%, 51%, 44%, 6%)

Oklch

oklch(70.9% 0.151 12.5)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#865B69

Dark Violet · DimGray · Camellia

HEX

#865B69

RGB

rgb(134, 91, 105)

HSL

hsl(340, 19%, 44%)

HSB

hsb(340, 32%, 53%)

CMYK

cmyk(0%, 32%, 22%, 47%)

Oklch

oklch(52.2% 0.060 358.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C7E1DC

E1C7CC

Analogous

C7E1CE

C7E1DC

C7D9E1

Triadic

C7E1DC

DBC7E1

E1DBC7

Split-Comp.

C7E1DC

E1C7D9

E1CEC7

Tetradic

C7E1DC

CEC7E1

E1C7CC

D9E1C7

Contrast Matrix WCAG 2.1 Contrast

C7E1DC	C2CCA4	D5AE92	EF7587	865B69
—	1.2 Fail	1.5 Fail	2.0 Fail	4.1 AA Large
1.2 Fail	—	1.2 Fail	1.6 Fail	3.4 AA Large
1.5 Fail	1.2 Fail	—	1.4 Fail	2.8 Fail
2.0 Fail	1.6 Fail	1.4 Fail	—	2.0 Fail
4.1 AA Large	3.4 AA Large	2.8 Fail	2.0 Fail	—

White BG

1.4Fail

1.7Fail

2.0Fail

2.8Fail

5.7AA

Black BG

15.2AAA

12.5AAA

10.3AAA

7.6AAA

3.7AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

D2D2DD

C6C6AE

C4C499

BAB983

737366

Deuteranopia

D1CFDE

C6C5B0

C6C99A

C1CA82

767965

Tritanopia

C8DEDE

C2B5B7

D39E9F

E97F7E

846362

Achromatopsia

D9D9D9

C4C4C4

B6B6B6

9C9C9C

696969

Shades & Tints Shades & Tints

#C7E1DC

Dark

Light

#C2CCA4

Dark

Light

#D5AE92

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c7e1dc;
  --color-2: #c2cca4;
  --color-3: #d5ae92;
  --color-4: #ef7587;
  --color-5: #865b69;
}

SCSS

$color-1: #c7e1dc;
$color-2: #c2cca4;
$color-3: #d5ae92;
$color-4: #ef7587;
$color-5: #865b69;

TAILWIND

colors: {
  'brand-1': '#c7e1dc',
  'brand-2': '#c2cca4',
  'brand-3': '#d5ae92',
  'brand-4': '#ef7587',
  'brand-5': '#865b69',
}

RGB Array

[199, 225, 220], [194, 204, 164], [213, 174, 146], [239, 117, 135], [134, 91, 105]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C7E1DC, #C2CCA4, #D5AE92, #EF7587, #865B69 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: #c7e1dc; --color-2: #c2cca4; --color-3: #d5ae92; --color-4: #ef7587; --color-5: #865b69. 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