← Back to Editor

#D6E3B8 · #F3F5D2 · #221916 · #D2CBA5 · #678579

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#D6E3B8

Willow Green · LightGray · Mint Green

HEX
#D6E3B8
RGB
rgb(214, 227, 184)
HSL
hsl(78, 43%, 81%)
HSB
hsb(78, 19%, 89%)
CMYK
cmyk(6%, 0%, 19%, 11%)
Oklch
oklch(89.5% 0.059 121.3)

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

#F3F5D2

Fresh Green · Beige · Lemon Cream

HEX
#F3F5D2
RGB
rgb(243, 245, 210)
HSL
hsl(63, 64%, 89%)
HSB
hsb(63, 14%, 96%)
CMYK
cmyk(1%, 0%, 14%, 4%)
Oklch
oklch(96.0% 0.046 109.9)

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

#221916

Tangerine · Black · Cinnamon

HEX
#221916
RGB
rgb(34, 25, 22)
HSL
hsl(15, 21%, 11%)
HSB
hsb(15, 35%, 13%)
CMYK
cmyk(0%, 26%, 35%, 87%)
Oklch
oklch(22.3% 0.016 39.2)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#D2CBA5

Fresh Green · Tan · Sunflower

HEX
#D2CBA5
RGB
rgb(210, 203, 165)
HSL
hsl(51, 33%, 74%)
HSB
hsb(51, 21%, 82%)
CMYK
cmyk(0%, 3%, 21%, 18%)
Oklch
oklch(83.8% 0.051 98.7)

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

#678579

Mineral Blue · SlateGray · Olive Green

HEX
#678579
RGB
rgb(103, 133, 121)
HSL
hsl(156, 13%, 46%)
HSB
hsb(156, 23%, 52%)
CMYK
cmyk(23%, 0%, 9%, 48%)
Oklch
oklch(59.0% 0.039 168.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D6E3B8
C6BAE3

Analogous

E3DBBA
D6E3B8
C2E3BA

Triadic

D6E3B8
BAD7E3
E3BAD7

Split-Comp.

D6E3B8
BAC2E3
DBBAE3

Tetradic

D6E3B8
BAE3DB
C6BAE3
E3BAC2

Contrast Matrix WCAG 2.1 Contrast

D6E3B8
F3F5D2
221916
D2CBA5
678579
—
1.2
Fail
12.8
AAA
1.2
Fail
3.0
Fail
1.2
Fail
—
15.4
AAA
1.5
Fail
3.6
AA Large
12.8
AAA
15.4
AAA
—
10.5
AAA
4.3
AA Large
1.2
Fail
1.5
Fail
10.5
AAA
—
2.5
Fail
3.0
Fail
3.6
AA Large
4.3
AA Large
2.5
Fail
—
White BG
1.4Fail
1.1Fail
17.2AAA
1.6Fail
4.0AA Large
Black BG
15.5AAA
18.8AAA
1.2Fail
12.8AAA
5.2AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DCDCC2
F4F4DA
1E1E17
CFCFAE
74747C

Deuteranopia

DBDAC5
F4F4DD
1F1F17
CFD0B0
72707D

Tritanopia

D7CBCC
F3E1E3
221717
D2B5B7
697E7F

Achromatopsia

DADADA
F0F0F0
1B1B1B
C9C9C9
7B7B7B

Shades & Tints Shades & Tints

#D6E3B8

Dark
Light

#F3F5D2

Dark
Light

#221916

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d6e3b8;
  --color-2: #f3f5d2;
  --color-3: #221916;
  --color-4: #d2cba5;
  --color-5: #678579;
}

SCSS

$color-1: #d6e3b8;
$color-2: #f3f5d2;
$color-3: #221916;
$color-4: #d2cba5;
$color-5: #678579;

TAILWIND

colors: {
  'brand-1': '#d6e3b8',
  'brand-2': '#f3f5d2',
  'brand-3': '#221916',
  'brand-4': '#d2cba5',
  'brand-5': '#678579',
}

RGB Array

[214, 227, 184], [243, 245, 210], [34, 25, 22], [210, 203, 165], [103, 133, 121]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D6E3B8, #F3F5D2, #221916, #D2CBA5, #678579 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: #d6e3b8; --color-2: #f3f5d2; --color-3: #221916; --color-4: #d2cba5; --color-5: #678579. 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 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