← Back to Editor

#C2DABC · #F6D1AC · #FCA883 · #DB676C · #5A4D5D

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#C2DABC

Celadon · Silver · Apple Green

HEX
#C2DABC
RGB
rgb(194, 218, 188)
HSL
hsl(108, 29%, 80%)
HSB
hsb(108, 14%, 85%)
CMYK
cmyk(11%, 0%, 14%, 15%)
Oklch
oklch(86.2% 0.048 139.4)

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

#F6D1AC

Goose Yellow · Wheat · Peach Orange

HEX
#F6D1AC
RGB
rgb(246, 209, 172)
HSL
hsl(30, 80%, 82%)
HSB
hsb(30, 30%, 96%)
CMYK
cmyk(0%, 15%, 30%, 4%)
Oklch
oklch(88.3% 0.064 66.8)

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

#FCA883

Apricot · LightSalmon · Warm Sun

HEX
#FCA883
RGB
rgb(252, 168, 131)
HSL
hsl(18, 95%, 75%)
HSB
hsb(18, 48%, 99%)
CMYK
cmyk(0%, 33%, 48%, 1%)
Oklch
oklch(80.6% 0.112 44.5)

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

#DB676C

Peach Pink · LightCoral · Coral Red

HEX
#DB676C
RGB
rgb(219, 103, 108)
HSL
hsl(357, 62%, 63%)
HSB
hsb(357, 53%, 86%)
CMYK
cmyk(0%, 53%, 51%, 14%)
Oklch
oklch(65.5% 0.146 19.3)

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

#5A4D5D

Dark Plum · DimGray · Charcoal

HEX
#5A4D5D
RGB
rgb(90, 77, 93)
HSL
hsl(289, 9%, 33%)
HSB
hsb(289, 17%, 36%)
CMYK
cmyk(3%, 17%, 0%, 64%)
Oklch
oklch(43.9% 0.031 319.9)

Traditional「Dark Plum」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C2DABC
D5BDDB

Analogous

D2DBBD
C2DABC
BDDBC6

Triadic

C2DABC
BDC3DB
DBBDC3

Split-Comp.

C2DABC
C6BDDB
DBBDD2

Tetradic

C2DABC
BDD2DB
D5BDDB
DBC6BD

Contrast Matrix WCAG 2.1 Contrast

C2DABC
F6D1AC
FCA883
DB676C
5A4D5D
—
1.0
Fail
1.3
Fail
2.3
Fail
5.3
AA
1.0
Fail
—
1.3
Fail
2.4
Fail
5.5
AA
1.3
Fail
1.3
Fail
—
1.8
Fail
4.2
AA Large
2.3
Fail
2.4
Fail
1.8
Fail
—
2.3
Fail
5.3
AA
5.5
AA
4.2
AA Large
2.3
Fail
—
White BG
1.5Fail
1.4Fail
1.9Fail
3.4AA Large
7.9AAA
Black BG
14.0AAA
14.6AAA
11.1AAA
6.2AA
2.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

CCCDC3
E6E6B5
D8D78C
A9A86B
545459

Deuteranopia

CBC9C5
E8EBB7
DDE38E
B0B86B
555658

Tritanopia

C3C9CA
F4BCBE
F89395
D56A6A
595655

Achromatopsia

CFCFCF
D8D8D8
BDBDBD
8A8A8A
535353

Shades & Tints Shades & Tints

#C2DABC

Dark
Light

#F6D1AC

Dark
Light

#FCA883

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c2dabc;
  --color-2: #f6d1ac;
  --color-3: #fca883;
  --color-4: #db676c;
  --color-5: #5a4d5d;
}

SCSS

$color-1: #c2dabc;
$color-2: #f6d1ac;
$color-3: #fca883;
$color-4: #db676c;
$color-5: #5a4d5d;

TAILWIND

colors: {
  'brand-1': '#c2dabc',
  'brand-2': '#f6d1ac',
  'brand-3': '#fca883',
  'brand-4': '#db676c',
  'brand-5': '#5a4d5d',
}

RGB Array

[194, 218, 188], [246, 209, 172], [252, 168, 131], [219, 103, 108], [90, 77, 93]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C2DABC, #F6D1AC, #FCA883, #DB676C, #5A4D5D is ideal for: health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #c2dabc; --color-2: #f6d1ac; --color-3: #fca883; --color-4: #db676c; --color-5: #5a4d5d. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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