← Back to Editor

#C4ADA2 · #BFC59A · #CBB18D · #DFA68E · #F09B97

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

WorkspaceReading

Color Details Color Details

#C4ADA2

Apricot · Tan · Warm Sun

HEX
#C4ADA2
RGB
rgb(196, 173, 162)
HSL
hsl(19, 22%, 70%)
HSB
hsb(19, 17%, 77%)
CMYK
cmyk(0%, 12%, 17%, 23%)
Oklch
oklch(76.4% 0.031 47.2)

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

#BFC59A

Fresh Green · Tan · Sunflower

HEX
#BFC59A
RGB
rgb(191, 197, 154)
HSL
hsl(68, 27%, 69%)
HSB
hsb(68, 22%, 77%)
CMYK
cmyk(3%, 0%, 22%, 23%)
Oklch
oklch(80.8% 0.058 114.2)

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

#CBB18D

Ginger · Tan · Warm Sun

HEX
#CBB18D
RGB
rgb(203, 177, 141)
HSL
hsl(35, 37%, 67%)
HSB
hsb(35, 31%, 80%)
CMYK
cmyk(0%, 13%, 31%, 20%)
Oklch
oklch(77.4% 0.057 75.7)

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

#DFA68E

Apricot · Tan · Warm Sun

HEX
#DFA68E
RGB
rgb(223, 166, 142)
HSL
hsl(18, 56%, 72%)
HSB
hsb(18, 36%, 87%)
CMYK
cmyk(0%, 26%, 36%, 13%)
Oklch
oklch(77.3% 0.076 43.8)

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

#F09B97

Peach Pink · DarkSalmon · Coral Red

HEX
#F09B97
RGB
rgb(240, 155, 151)
HSL
hsl(3, 75%, 77%)
HSB
hsb(3, 37%, 94%)
CMYK
cmyk(0%, 35%, 37%, 6%)
Oklch
oklch(77.4% 0.103 22.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C4ADA2
A2B9C3

Analogous

C3A2A8
C4ADA2
C3BDA2

Triadic

C4ADA2
A2C3AC
ACA2C3

Split-Comp.

C4ADA2
A2C3BD
A2A8C3

Tetradic

C4ADA2
A8C3A2
A2B9C3
BDA2C3

Contrast Matrix WCAG 2.1 Contrast

C4ADA2
BFC59A
CBB18D
DFA68E
F09B97
—
1.2
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.2
Fail
—
1.1
Fail
1.2
Fail
1.2
Fail
1.0
Fail
1.1
Fail
—
1.0
Fail
1.0
Fail
1.0
Fail
1.2
Fail
1.0
Fail
—
1.0
Fail
1.0
Fail
1.2
Fail
1.0
Fail
1.0
Fail
—
White BG
2.1Fail
1.8Fail
2.1Fail
2.1Fail
2.1Fail
Black BG
9.8AAA
11.7AAA
10.2AAA
10.0AAA
9.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BABAA5
C2C2A4
C0C096
C6C694
CBCA98

Deuteranopia

BBBDA5
C1C1A7
C1C398
CACE95
D0D798

Tritanopia

C3A7A7
BFADAE
CA9D9E
DC9899
EC9999

Achromatopsia

B3B3B3
BEBEBE
B5B5B5
B4B4B4
B4B4B4

Shades & Tints Shades & Tints

#C4ADA2

Dark
Light

#BFC59A

Dark
Light

#CBB18D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c4ada2;
  --color-2: #bfc59a;
  --color-3: #cbb18d;
  --color-4: #dfa68e;
  --color-5: #f09b97;
}

SCSS

$color-1: #c4ada2;
$color-2: #bfc59a;
$color-3: #cbb18d;
$color-4: #dfa68e;
$color-5: #f09b97;

TAILWIND

colors: {
  'brand-1': '#c4ada2',
  'brand-2': '#bfc59a',
  'brand-3': '#cbb18d',
  'brand-4': '#dfa68e',
  'brand-5': '#f09b97',
}

RGB Array

[196, 173, 162], [191, 197, 154], [203, 177, 141], [223, 166, 142], [240, 155, 151]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C4ADA2, #BFC59A, #CBB18D, #DFA68E, #F09B97 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: #c4ada2; --color-2: #bfc59a; --color-3: #cbb18d; --color-4: #dfa68e; --color-5: #f09b97. 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