#CFC399 + #DFD5A2 + #FF6D6D + #85B094 + #6FA38D - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#CFC399

Goose Yellow · Tan · Sunflower

HEX

#CFC399

RGB

rgb(207, 195, 153)

HSL

hsl(47, 36%, 71%)

HSB

hsb(47, 26%, 81%)

CMYK

cmyk(0%, 6%, 26%, 19%)

Oklch

oklch(81.7% 0.058 94.0)

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

#DFD5A2

Fresh Green · Wheat · Sunflower

HEX

#DFD5A2

RGB

rgb(223, 213, 162)

HSL

hsl(50, 49%, 75%)

HSB

hsb(50, 27%, 87%)

CMYK

cmyk(0%, 4%, 27%, 13%)

Oklch

oklch(86.9% 0.068 98.3)

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

#FF6D6D

Peach Pink · Salmon · Coral Red

HEX

#FF6D6D

RGB

rgb(255, 109, 109)

HSL

hsl(0, 100%, 71%)

HSB

hsb(0, 57%, 100%)

CMYK

cmyk(0%, 57%, 57%, 0%)

Oklch

oklch(71.5% 0.179 22.7)

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

#85B094

Celadon · DarkSeaGreen · Apple Green

HEX

#85B094

RGB

rgb(133, 176, 148)

HSL

hsl(141, 21%, 61%)

HSB

hsb(141, 24%, 69%)

CMYK

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

Oklch

oklch(71.8% 0.062 156.0)

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

#6FA38D

Mineral Blue · CadetBlue · Olive Green

HEX

#6FA38D

RGB

rgb(111, 163, 141)

HSL

hsl(155, 22%, 54%)

HSB

hsb(155, 32%, 64%)

CMYK

cmyk(32%, 0%, 13%, 36%)

Oklch

oklch(67.2% 0.064 166.2)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CFC399

9AA6D0

Analogous

D0AA9A

CFC399

C1D09A

Triadic

CFC399

9AD0C4

C49AD0

Split-Comp.

CFC399

9AC1D0

AA9AD0

Tetradic

CFC399

9AD0AA

9AA6D0

D09AC1

Contrast Matrix WCAG 2.1 Contrast

CFC399	DFD5A2	FF6D6D	85B094	6FA38D
—	1.2 Fail	1.6 Fail	1.4 Fail	1.6 Fail
1.2 Fail	—	1.9 Fail	1.6 Fail	1.9 Fail
1.6 Fail	1.9 Fail	—	1.1 Fail	1.0 Fail
1.4 Fail	1.6 Fail	1.1 Fail	—	1.2 Fail
1.6 Fail	1.9 Fail	1.0 Fail	1.2 Fail	—

White BG

1.8Fail

1.5Fail

2.7Fail

2.4Fail

2.9Fail

Black BG

11.9AAA

14.2AAA

7.7AAA

8.6AAA

7.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CACAA3

DBDBAE

C0BE6D

98989B

868692

Deuteranopia

CBCBA6

DBDCB1

C8D36D

95929C

837F94

Tritanopia

CEABAD

DFB8BA

F86D6D

87A0A1

729797

Achromatopsia

C2C2C2

D2D2D2

999999

A0A0A0

919191

Shades & Tints Shades & Tints

#CFC399

Dark

Light

#DFD5A2

Dark

Light

#FF6D6D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cfc399;
  --color-2: #dfd5a2;
  --color-3: #ff6d6d;
  --color-4: #85b094;
  --color-5: #6fa38d;
}

SCSS

$color-1: #cfc399;
$color-2: #dfd5a2;
$color-3: #ff6d6d;
$color-4: #85b094;
$color-5: #6fa38d;

TAILWIND

colors: {
  'brand-1': '#cfc399',
  'brand-2': '#dfd5a2',
  'brand-3': '#ff6d6d',
  'brand-4': '#85b094',
  'brand-5': '#6fa38d',
}

RGB Array

[207, 195, 153], [223, 213, 162], [255, 109, 109], [133, 176, 148], [111, 163, 141]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CFC399, #DFD5A2, #FF6D6D, #85B094, #6FA38D 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: #cfc399; --color-2: #dfd5a2; --color-3: #ff6d6d; --color-4: #85b094; --color-5: #6fa38d. 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