← Back to Editor

#D3DFC1 · #ACD9B8 · #A9B39C · #787D79 · #B2A28B

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

#D3DFC1

Willow Green · LightGray · Mint Green

HEX
#D3DFC1
RGB
rgb(211, 223, 193)
HSL
hsl(84, 32%, 82%)
HSB
hsb(84, 13%, 87%)
CMYK
cmyk(5%, 0%, 13%, 13%)
Oklch
oklch(88.7% 0.042 125.0)

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

#ACD9B8

Celadon · Silver · Apple Green

HEX
#ACD9B8
RGB
rgb(172, 217, 184)
HSL
hsl(136, 37%, 76%)
HSB
hsb(136, 21%, 85%)
CMYK
cmyk(21%, 0%, 15%, 15%)
Oklch
oklch(84.4% 0.066 153.1)

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

#A9B39C

Willow Green · DarkGray · Apple Green

HEX
#A9B39C
RGB
rgb(169, 179, 156)
HSL
hsl(86, 13%, 66%)
HSB
hsb(86, 13%, 70%)
CMYK
cmyk(6%, 0%, 13%, 30%)
Oklch
oklch(75.2% 0.034 126.4)

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

#787D79

Ink Gray · Gray · Warm Gray

HEX
#787D79
RGB
rgb(120, 125, 121)
HSL
hsl(132, 2%, 48%)
HSB
hsb(132, 4%, 49%)
CMYK
cmyk(4%, 0%, 3%, 51%)
Oklch
oklch(58.4% 0.008 151.8)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#B2A28B

Ginger · DarkGray · Warm Sun

HEX
#B2A28B
RGB
rgb(178, 162, 139)
HSL
hsl(35, 20%, 62%)
HSB
hsb(35, 22%, 70%)
CMYK
cmyk(0%, 9%, 22%, 30%)
Oklch
oklch(72.0% 0.037 77.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D3DFC1
CEC2E0

Analogous

E0DDC2
D3DFC1
C5E0C2

Triadic

D3DFC1
C2D4E0
E0C2D4

Split-Comp.

D3DFC1
C2C5E0
DDC2E0

Tetradic

D3DFC1
C2E0DD
CEC2E0
E0C2C5

Contrast Matrix WCAG 2.1 Contrast

D3DFC1
ACD9B8
A9B39C
787D79
B2A28B
—
1.1
Fail
1.6
Fail
3.0
AA Large
1.8
Fail
1.1
Fail
—
1.4
Fail
2.7
Fail
1.6
Fail
1.6
Fail
1.4
Fail
—
1.9
Fail
1.1
Fail
3.0
AA Large
2.7
Fail
1.9
Fail
—
1.7
Fail
1.8
Fail
1.6
Fail
1.1
Fail
1.7
Fail
—
White BG
1.4Fail
1.6Fail
2.2Fail
4.2AA Large
2.5Fail
Black BG
15.1AAA
13.4AAA
9.6AAA
5.0AA
8.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D8D8C8
BFC0C0
ADADA2
7A7A7A
ABAB91

Deuteranopia

D8D7CA
BDBAC2
ADACA3
7A7A7A
ACAD92

Tritanopia

D4CECF
AEC6C8
A9A6A7
787B7B
B19596

Achromatopsia

D8D8D8
C8C8C8
ADADAD
7B7B7B
A4A4A4

Shades & Tints Shades & Tints

#D3DFC1

Dark
Light

#ACD9B8

Dark
Light

#A9B39C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d3dfc1;
  --color-2: #acd9b8;
  --color-3: #a9b39c;
  --color-4: #787d79;
  --color-5: #b2a28b;
}

SCSS

$color-1: #d3dfc1;
$color-2: #acd9b8;
$color-3: #a9b39c;
$color-4: #787d79;
$color-5: #b2a28b;

TAILWIND

colors: {
  'brand-1': '#d3dfc1',
  'brand-2': '#acd9b8',
  'brand-3': '#a9b39c',
  'brand-4': '#787d79',
  'brand-5': '#b2a28b',
}

RGB Array

[211, 223, 193], [172, 217, 184], [169, 179, 156], [120, 125, 121], [178, 162, 139]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D3DFC1, #ACD9B8, #A9B39C, #787D79, #B2A28B is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #d3dfc1; --color-2: #acd9b8; --color-3: #a9b39c; --color-4: #787d79; --color-5: #b2a28b. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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