← Back to Editor

#DFE4A1 · #F0F5BB · #9A839F · #6B5468 · #43213C

cool

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#DFE4A1

Fresh Green · Khaki · Lemon Cream

HEX
#DFE4A1
RGB
rgb(223, 228, 161)
HSL
hsl(64, 55%, 76%)
HSB
hsb(64, 29%, 89%)
CMYK
cmyk(2%, 0%, 29%, 11%)
Oklch
oklch(89.9% 0.087 111.6)

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

#F0F5BB

Fresh Green · Bisque · Lemon Cream

HEX
#F0F5BB
RGB
rgb(240, 245, 187)
HSL
hsl(65, 74%, 85%)
HSB
hsb(65, 24%, 96%)
CMYK
cmyk(2%, 0%, 24%, 4%)
Oklch
oklch(95.2% 0.075 111.8)

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

#9A839F

Dark Plum · LightSlateGray · Violet

HEX
#9A839F
RGB
rgb(154, 131, 159)
HSL
hsl(289, 13%, 57%)
HSB
hsb(289, 18%, 62%)
CMYK
cmyk(3%, 18%, 0%, 38%)
Oklch
oklch(64.0% 0.049 320.2)

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

#6B5468

Rose Purple · DimGray · Eggplant

HEX
#6B5468
RGB
rgb(107, 84, 104)
HSL
hsl(308, 12%, 37%)
HSB
hsb(308, 21%, 42%)
CMYK
cmyk(0%, 21%, 3%, 58%)
Oklch
oklch(47.6% 0.043 330.6)

Traditional「Rose Purple」· Paint「Eggplant」· Creative Blush Sunrise

#43213C

Rose Purple · DarkSlateGray · Dark Purple

HEX
#43213C
RGB
rgb(67, 33, 60)
HSL
hsl(312, 34%, 20%)
HSB
hsb(312, 51%, 26%)
CMYK
cmyk(0%, 51%, 10%, 74%)
Oklch
oklch(30.5% 0.066 335.2)

Traditional「Rose Purple」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DFE4A1
A5A0E3

Analogous

E3C6A0
DFE4A1
BDE3A0

Triadic

DFE4A1
A0DFE3
E3A0DF

Split-Comp.

DFE4A1
A0BDE3
C6A0E3

Tetradic

DFE4A1
A0E3C6
A5A0E3
E3A0BD

Contrast Matrix WCAG 2.1 Contrast

DFE4A1
F0F5BB
9A839F
6B5468
43213C
—
1.2
Fail
2.6
Fail
5.1
AA
10.4
AAA
1.2
Fail
—
3.0
AA Large
6.0
AA
12.1
AAA
2.6
Fail
3.0
AA Large
—
2.0
Fail
4.0
AA Large
5.1
AA
6.0
AA
2.0
Fail
—
2.0
Fail
10.4
AAA
12.1
AAA
4.0
AA Large
2.0
Fail
—
White BG
1.3Fail
1.1Fail
3.4AA Large
6.8AA
13.8AAA
Black BG
15.7AAA
18.5AAA
6.1AA
3.1AA Large
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E1E1B1
F2F2C9
909098
616163
343435

Deuteranopia

E1E1B5
F2F2CC
919397
626462
363934

Tritanopia

DFBEC1
F0D4D7
999392
6A5F5F
41302F

Achromatopsia

DBDBDB
EDEDED
8D8D8D
5D5D5D
2E2E2E

Shades & Tints Shades & Tints

#DFE4A1

Dark
Light

#F0F5BB

Dark
Light

#9A839F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dfe4a1;
  --color-2: #f0f5bb;
  --color-3: #9a839f;
  --color-4: #6b5468;
  --color-5: #43213c;
}

SCSS

$color-1: #dfe4a1;
$color-2: #f0f5bb;
$color-3: #9a839f;
$color-4: #6b5468;
$color-5: #43213c;

TAILWIND

colors: {
  'brand-1': '#dfe4a1',
  'brand-2': '#f0f5bb',
  'brand-3': '#9a839f',
  'brand-4': '#6b5468',
  'brand-5': '#43213c',
}

RGB Array

[223, 228, 161], [240, 245, 187], [154, 131, 159], [107, 84, 104], [67, 33, 60]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #DFE4A1, #F0F5BB, #9A839F, #6B5468, #43213C is ideal for: 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: #dfe4a1; --color-2: #f0f5bb; --color-3: #9a839f; --color-4: #6b5468; --color-5: #43213c. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 cool-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