#909B91 + #B8CAAA + #E1D6B5 + #E4AD90 + #C48371 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#909B91

Ash · LightSlateGray · Silver Sand

HEX

#909B91

RGB

rgb(144, 155, 145)

HSL

hsl(125, 5%, 59%)

HSB

hsb(125, 7%, 61%)

CMYK

cmyk(7%, 0%, 6%, 39%)

Oklch

oklch(67.8% 0.019 148.0)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#B8CAAA

Celadon · Silver · Apple Green

HEX

#B8CAAA

RGB

rgb(184, 202, 170)

HSL

hsl(94, 23%, 73%)

HSB

hsb(94, 16%, 79%)

CMYK

cmyk(9%, 0%, 16%, 21%)

Oklch

oklch(81.7% 0.048 131.5)

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

#E1D6B5

Goose Yellow · Wheat · Lemon Cream

HEX

#E1D6B5

RGB

rgb(225, 214, 181)

HSL

hsl(45, 42%, 80%)

HSB

hsb(45, 20%, 88%)

CMYK

cmyk(0%, 5%, 20%, 12%)

Oklch

oklch(87.6% 0.045 91.8)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#E4AD90

Apricot · BurlyWood · Warm Sun

HEX

#E4AD90

RGB

rgb(228, 173, 144)

HSL

hsl(21, 61%, 73%)

HSB

hsb(21, 37%, 89%)

CMYK

cmyk(0%, 24%, 37%, 11%)

Oklch

oklch(79.1% 0.076 49.0)

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

#C48371

Peach Pink · DarkSalmon · Coral Red

HEX

#C48371

RGB

rgb(196, 131, 113)

HSL

hsl(13, 41%, 61%)

HSB

hsb(13, 42%, 77%)

CMYK

cmyk(0%, 33%, 42%, 23%)

Oklch

oklch(67.2% 0.085 36.2)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

909B91

9C919B

Analogous

969C91

909B91

919C97

Triadic

909B91

92919C

9C9291

Split-Comp.

909B91

97919C

9C9196

Tetradic

909B91

91969C

9C919B

9C9791

Contrast Matrix WCAG 2.1 Contrast

909B91	B8CAAA	E1D6B5	E4AD90	C48371
—	1.7 Fail	2.0 Fail	1.5 Fail	1.1 Fail
1.7 Fail	—	1.2 Fail	1.1 Fail	1.8 Fail
2.0 Fail	1.2 Fail	—	1.4 Fail	2.1 Fail
1.5 Fail	1.1 Fail	1.4 Fail	—	1.6 Fail
1.1 Fail	1.8 Fail	2.1 Fail	1.6 Fail	—

White BG

2.9Fail

1.7Fail

1.4Fail

2.0Fail

3.1AA Large

Black BG

7.3AAA

12.1AAA

14.5AAA

10.7AAA

6.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

959593

C0C0B2

DCDCBD

CCCC97

A8A775

Deuteranopia

949394

BFBDB4

DDDEBF

CFD499

ACB176

Tritanopia

919596

B9B8B9

E0C3C5

E19D9E

C1797A

Achromatopsia

979797

C1C1C1

D6D6D6

BABABA

949494

Shades & Tints Shades & Tints

#909B91

Dark

Light

#B8CAAA

Dark

Light

#E1D6B5

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #909b91;
  --color-2: #b8caaa;
  --color-3: #e1d6b5;
  --color-4: #e4ad90;
  --color-5: #c48371;
}

SCSS

$color-1: #909b91;
$color-2: #b8caaa;
$color-3: #e1d6b5;
$color-4: #e4ad90;
$color-5: #c48371;

TAILWIND

colors: {
  'brand-1': '#909b91',
  'brand-2': '#b8caaa',
  'brand-3': '#e1d6b5',
  'brand-4': '#e4ad90',
  'brand-5': '#c48371',
}

RGB Array

[144, 155, 145], [184, 202, 170], [225, 214, 181], [228, 173, 144], [196, 131, 113]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #909B91, #B8CAAA, #E1D6B5, #E4AD90, #C48371 is ideal for: health products, baby brands, fresh-style blogs. 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: #909b91; --color-2: #b8caaa; --color-3: #e1d6b5; --color-4: #e4ad90; --color-5: #c48371. 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 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