← Back to Editor

#89816C · #B3A78F · #FAF4D1 · #DAE6DC · #B7C5D0

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#89816C

Ochre · Gray · Honey Gold

HEX
#89816C
RGB
rgb(137, 129, 108)
HSL
hsl(43, 12%, 48%)
HSB
hsb(43, 21%, 54%)
CMYK
cmyk(0%, 6%, 21%, 46%)
Oklch
oklch(60.4% 0.032 89.6)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#B3A78F

Ginger · DarkGray · Sunflower

HEX
#B3A78F
RGB
rgb(179, 167, 143)
HSL
hsl(40, 19%, 63%)
HSB
hsb(40, 20%, 70%)
CMYK
cmyk(0%, 7%, 20%, 30%)
Oklch
oklch(73.2% 0.036 84.6)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#FAF4D1

Fresh Green · Beige · Lemon Cream

HEX
#FAF4D1
RGB
rgb(250, 244, 209)
HSL
hsl(51, 80%, 90%)
HSB
hsb(51, 16%, 98%)
CMYK
cmyk(0%, 2%, 16%, 2%)
Oklch
oklch(96.3% 0.046 99.2)

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

#DAE6DC

Celadon · LightGray · Mint Green

HEX
#DAE6DC
RGB
rgb(218, 230, 220)
HSL
hsl(130, 19%, 88%)
HSB
hsb(130, 5%, 90%)
CMYK
cmyk(5%, 0%, 4%, 10%)
Oklch
oklch(91.3% 0.019 150.5)

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

#B7C5D0

Sky Blue · LightSteelBlue · Cobalt Blue

HEX
#B7C5D0
RGB
rgb(183, 197, 208)
HSL
hsl(206, 21%, 77%)
HSB
hsb(206, 12%, 82%)
CMYK
cmyk(12%, 5%, 0%, 18%)
Oklch
oklch(81.6% 0.022 241.4)

Traditional「Sky Blue」· Paint「Cobalt Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

89816C
6C7489

Analogous

89726C
89816C
83896C

Triadic

89816C
6C8981
816C89

Split-Comp.

89816C
6C8389
726C89

Tetradic

89816C
6C8972
6C7489
896C83

Contrast Matrix WCAG 2.1 Contrast

89816C
B3A78F
FAF4D1
DAE6DC
B7C5D0
—
1.6
Fail
3.5
AA Large
3.0
AA Large
2.2
Fail
1.6
Fail
—
2.1
Fail
1.8
Fail
1.3
Fail
3.5
AA Large
2.1
Fail
—
1.2
Fail
1.6
Fail
3.0
AA Large
1.8
Fail
1.2
Fail
—
1.4
Fail
2.2
Fail
1.3
Fail
1.6
Fail
1.4
Fail
—
White BG
3.9AA Large
2.4Fail
1.1Fail
1.3Fail
1.8Fail
Black BG
5.4AA
8.8AAA
18.9AAA
16.3AAA
11.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

868571
AEAE95
F7F7D9
DFDFDE
BDBDCD

Deuteranopia

868772
AFAF96
F8F8DC
DFDEDF
BCBBCD

Tritanopia

897576
B2999A
FAE0E2
DBE0E1
B8CBCB

Achromatopsia

818181
A8A8A8
F2F2F2
E1E1E1
C2C2C2

Shades & Tints Shades & Tints

#89816C

Dark
Light

#B3A78F

Dark
Light

#FAF4D1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #89816c;
  --color-2: #b3a78f;
  --color-3: #faf4d1;
  --color-4: #dae6dc;
  --color-5: #b7c5d0;
}

SCSS

$color-1: #89816c;
$color-2: #b3a78f;
$color-3: #faf4d1;
$color-4: #dae6dc;
$color-5: #b7c5d0;

TAILWIND

colors: {
  'brand-1': '#89816c',
  'brand-2': '#b3a78f',
  'brand-3': '#faf4d1',
  'brand-4': '#dae6dc',
  'brand-5': '#b7c5d0',
}

RGB Array

[137, 129, 108], [179, 167, 143], [250, 244, 209], [218, 230, 220], [183, 197, 208]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #89816C, #B3A78F, #FAF4D1, #DAE6DC, #B7C5D0 is ideal for: health products, baby brands, fresh-style blogs, 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: #89816c; --color-2: #b3a78f; --color-3: #faf4d1; --color-4: #dae6dc; --color-5: #b7c5d0. 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. 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