#D1CFA1 + #AABF93 + #D1C55C + #ED995C + #F86261 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D1CFA1

Fresh Green · Tan · Sunflower

HEX

#D1CFA1

RGB

rgb(209, 207, 161)

HSL

hsl(58, 34%, 73%)

HSB

hsb(58, 23%, 82%)

CMYK

cmyk(0%, 1%, 23%, 18%)

Oklch

oklch(84.5% 0.061 105.6)

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

#AABF93

Willow Green · DarkSeaGreen · Apple Green

HEX

#AABF93

RGB

rgb(170, 191, 147)

HSL

hsl(89, 26%, 66%)

HSB

hsb(89, 23%, 75%)

CMYK

cmyk(11%, 0%, 23%, 25%)

Oklch

oklch(77.7% 0.065 128.6)

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

#D1C55C

Autumn Sage · BurlyWood · Sunflower

HEX

#D1C55C

RGB

rgb(209, 197, 92)

HSL

hsl(54, 56%, 59%)

HSB

hsb(54, 56%, 82%)

CMYK

cmyk(0%, 6%, 56%, 18%)

Oklch

oklch(81.3% 0.127 102.8)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#ED995C

Apricot · SandyBrown · Warm Sun

HEX

#ED995C

RGB

rgb(237, 153, 92)

HSL

hsl(25, 80%, 65%)

HSB

hsb(25, 61%, 93%)

CMYK

cmyk(0%, 35%, 61%, 7%)

Oklch

oklch(75.6% 0.127 55.4)

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

#F86261

Peach Pink · Tomato · Coral Red

HEX

#F86261

RGB

rgb(248, 98, 97)

HSL

hsl(0, 92%, 68%)

HSB

hsb(0, 61%, 97%)

CMYK

cmyk(0%, 60%, 61%, 3%)

Oklch

oklch(68.8% 0.185 23.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D1CFA1

A3A4D2

Analogous

D2B9A3

D1CFA1

BCD2A3

Triadic

D1CFA1

A3D2D0

D0A3D2

Split-Comp.

D1CFA1

A3BCD2

B9A3D2

Tetradic

D1CFA1

A3D2B9

A3A4D2

D2A3BC

Contrast Matrix WCAG 2.1 Contrast

D1CFA1	AABF93	D1C55C	ED995C	F86261
—	1.2 Fail	1.1 Fail	1.4 Fail	1.9 Fail
1.2 Fail	—	1.1 Fail	1.1 Fail	1.5 Fail
1.1 Fail	1.1 Fail	—	1.3 Fail	1.7 Fail
1.4 Fail	1.1 Fail	1.3 Fail	—	1.3 Fail
1.9 Fail	1.5 Fail	1.7 Fail	1.3 Fail	—

White BG

1.6Fail

2.0Fail

1.8Fail

2.3Fail

3.0AA Large

Black BG

13.2AAA

10.6AAA

11.9AAA

9.3AAA

6.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D0D0AC

B3B39E

CCCC75

C9C86B

B7B661

Deuteranopia

D0D0AF

B2B0A0

CDCD7B

CED46E

C0CB61

Tritanopia

D1B5B7

ABA6A8

D0898E

E97679

F16161

Achromatopsia

CACACA

B4B4B4

BDBDBD

ABABAB

8F8F8F

Shades & Tints Shades & Tints

#D1CFA1

Dark

Light

#AABF93

Dark

Light

#D1C55C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d1cfa1;
  --color-2: #aabf93;
  --color-3: #d1c55c;
  --color-4: #ed995c;
  --color-5: #f86261;
}

SCSS

$color-1: #d1cfa1;
$color-2: #aabf93;
$color-3: #d1c55c;
$color-4: #ed995c;
$color-5: #f86261;

TAILWIND

colors: {
  'brand-1': '#d1cfa1',
  'brand-2': '#aabf93',
  'brand-3': '#d1c55c',
  'brand-4': '#ed995c',
  'brand-5': '#f86261',
}

RGB Array

[209, 207, 161], [170, 191, 147], [209, 197, 92], [237, 153, 92], [248, 98, 97]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D1CFA1, #AABF93, #D1C55C, #ED995C, #F86261 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: #d1cfa1; --color-2: #aabf93; --color-3: #d1c55c; --color-4: #ed995c; --color-5: #f86261. 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