← Back to Editor

#B6C4AA · #DAE898 · #CFD267 · #B4A709 · #6C504E

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#B6C4AA

Celadon · Silver · Apple Green

HEX
#B6C4AA
RGB
rgb(182, 196, 170)
HSL
hsl(92, 18%, 72%)
HSB
hsb(92, 13%, 77%)
CMYK
cmyk(7%, 0%, 13%, 23%)
Oklch
oklch(80.2% 0.039 130.5)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#DAE898

Willow Green · Khaki · Apple Green

HEX
#DAE898
RGB
rgb(218, 232, 152)
HSL
hsl(71, 63%, 75%)
HSB
hsb(71, 34%, 91%)
CMYK
cmyk(6%, 0%, 34%, 9%)
Oklch
oklch(90.2% 0.103 116.6)

TraditionalWillow Green」· PaintApple Green」· Creative Mint Breeze

#CFD267

Fresh Green · BurlyWood · Sunflower

HEX
#CFD267
RGB
rgb(207, 210, 103)
HSL
hsl(62, 54%, 61%)
HSB
hsb(62, 51%, 82%)
CMYK
cmyk(1%, 0%, 51%, 18%)
Oklch
oklch(84.0% 0.131 110.4)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

#B4A709

Autumn Sage · DarkGoldenRod · Honey Gold

HEX
#B4A709
RGB
rgb(180, 167, 9)
HSL
hsl(55, 90%, 37%)
HSB
hsb(55, 95%, 71%)
CMYK
cmyk(0%, 7%, 95%, 29%)
Oklch
oklch(71.7% 0.150 103.9)

TraditionalAutumn Sage」· PaintHoney Gold」· Creative Blush Sunrise

#6C504E

Crimson · DimGray · Wine Red

HEX
#6C504E
RGB
rgb(108, 80, 78)
HSL
hsl(4, 16%, 36%)
HSB
hsb(4, 28%, 42%)
CMYK
cmyk(0%, 26%, 28%, 58%)
Oklch
oklch(46.0% 0.038 23.3)

TraditionalCrimson」· PaintWine Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B6C4AA
B8ABC4

Analogous

C4C4AB
B6C4AA
ABC4AC

Triadic

B6C4AA
ABB7C4
C4ABB7

Split-Comp.

B6C4AA
ACABC4
C4ABC4

Tetradic

B6C4AA
ABC4C4
B8ABC4
C4ACAB

Contrast Matrix WCAG 2.1 Contrast

B6C4AA
DAE898
CFD267
B4A709
6C504E
1.4
Fail
1.1
Fail
1.4
Fail
4.0
AA Large
1.4
Fail
1.2
Fail
1.9
Fail
5.5
AA
1.1
Fail
1.2
Fail
1.5
Fail
4.5
AA
1.4
Fail
1.9
Fail
1.5
Fail
2.9
Fail
4.0
AA Large
5.5
AA
4.5
AA
2.9
Fail
White BG
1.8Fail
1.3Fail
1.6Fail
2.5Fail
7.3AAA
Black BG
11.5AAA
16.0AAA
13.1AAA
8.5AAA
2.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

BCBCB0
E0E0AB
D0D081
AEAE2F
60604E

Deuteranopia

BBBAB2
DFDEB0
D0D087
AFB038
62644F

Tritanopia

B7B5B6
DBBBBE
CF959A
B34D54
6B4F4F

Achromatopsia

BDBDBD
DBDBDB
C5C5C5
999999
585858

Shades & Tints Shades & Tints

#B6C4AA

Dark
Light

#DAE898

Dark
Light

#CFD267

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b6c4aa;
  --color-2: #dae898;
  --color-3: #cfd267;
  --color-4: #b4a709;
  --color-5: #6c504e;
}

SCSS

$color-1: #b6c4aa;
$color-2: #dae898;
$color-3: #cfd267;
$color-4: #b4a709;
$color-5: #6c504e;

TAILWIND

colors: {
  'brand-1': '#b6c4aa',
  'brand-2': '#dae898',
  'brand-3': '#cfd267',
  'brand-4': '#b4a709',
  'brand-5': '#6c504e',
}

RGB Array

[182, 196, 170], [218, 232, 152], [207, 210, 103], [180, 167, 9], [108, 80, 78]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B6C4AA, #DAE898, #CFD267, #B4A709, #6C504E is ideal for: corporate websites, product showcases, portfolios. 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: #b6c4aa; --color-2: #dae898; --color-3: #cfd267; --color-4: #b4a709; --color-5: #6c504e. 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. 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