#94838D + #C1D7C0 + #DBECC6 + #F2F9BB + #FBC194 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#94838D

Ash · Gray · Warm Gray

HEX

#94838D

RGB

rgb(148, 131, 141)

HSL

hsl(325, 7%, 55%)

HSB

hsb(325, 11%, 58%)

CMYK

cmyk(0%, 11%, 5%, 42%)

Oklch

oklch(62.8% 0.025 341.7)

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

#C1D7C0

Celadon · Silver · Apple Green

HEX

#C1D7C0

RGB

rgb(193, 215, 192)

HSL

hsl(117, 22%, 80%)

HSB

hsb(117, 11%, 84%)

CMYK

cmyk(10%, 0%, 11%, 16%)

Oklch

oklch(85.6% 0.039 144.0)

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

#DBECC6

Willow Green · LightGray · Mint Green

HEX

#DBECC6

RGB

rgb(219, 236, 198)

HSL

hsl(87, 50%, 85%)

HSB

hsb(87, 16%, 93%)

CMYK

cmyk(7%, 0%, 16%, 7%)

Oklch

oklch(92.1% 0.054 127.1)

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

#F2F9BB

Fresh Green · Bisque · Lemon Cream

HEX

#F2F9BB

RGB

rgb(242, 249, 187)

HSL

hsl(67, 84%, 85%)

HSB

hsb(67, 25%, 98%)

CMYK

cmyk(3%, 0%, 25%, 2%)

Oklch

oklch(96.2% 0.080 113.1)

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

#FBC194

Apricot · BurlyWood · Peach Orange

HEX

#FBC194

RGB

rgb(251, 193, 148)

HSL

hsl(26, 93%, 78%)

HSB

hsb(26, 41%, 98%)

CMYK

cmyk(0%, 23%, 41%, 2%)

Oklch

oklch(85.3% 0.089 59.0)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

94838D

84948B

Analogous

938494

94838D

948486

Triadic

94838D

8E9484

848E94

Split-Comp.

94838D

869484

849493

Tetradic

94838D

949384

84948B

848694

Contrast Matrix WCAG 2.1 Contrast

94838D	C1D7C0	DBECC6	F2F9BB	FBC194
—	2.3 Fail	2.9 Fail	3.2 AA Large	2.2 Fail
2.3 Fail	—	1.2 Fail	1.4 Fail	1.0 Fail
2.9 Fail	1.2 Fail	—	1.1 Fail	1.3 Fail
3.2 AA Large	1.4 Fail	1.1 Fail	—	1.4 Fail
2.2 Fail	1.0 Fail	1.3 Fail	1.4 Fail	—

White BG

3.6AA Large

1.5Fail

1.2Fail

1.1Fail

1.6Fail

Black BG

5.9AA

13.7AAA

16.8AAA

19.0AAA

13.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8D8C8B

CBCBC6

E2E3CF

F5F5CA

E2E19F

Deuteranopia

8E8F8A

C9C8C7

E1E0D1

F5F4CE

E5EAA2

Tritanopia

938988

C2CACB

DCD6D8

F2D6D8

F8A7A9

Achromatopsia

898989

CECECE

E3E3E3

F0F0F0

CDCDCD

Shades & Tints Shades & Tints

#94838D

Dark

Light

#C1D7C0

Dark

Light

#DBECC6

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #94838d;
  --color-2: #c1d7c0;
  --color-3: #dbecc6;
  --color-4: #f2f9bb;
  --color-5: #fbc194;
}

SCSS

$color-1: #94838d;
$color-2: #c1d7c0;
$color-3: #dbecc6;
$color-4: #f2f9bb;
$color-5: #fbc194;

TAILWIND

colors: {
  'brand-1': '#94838d',
  'brand-2': '#c1d7c0',
  'brand-3': '#dbecc6',
  'brand-4': '#f2f9bb',
  'brand-5': '#fbc194',
}

RGB Array

[148, 131, 141], [193, 215, 192], [219, 236, 198], [242, 249, 187], [251, 193, 148]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #94838D, #C1D7C0, #DBECC6, #F2F9BB, #FBC194 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: #94838d; --color-2: #c1d7c0; --color-3: #dbecc6; --color-4: #f2f9bb; --color-5: #fbc194. 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