#90A795 + #AA9884 + #A4BCAF + #DCD0C0 + #FDEBD5 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#90A795

Celadon · DarkSeaGreen · Apple Green

HEX

#90A795

RGB

rgb(144, 167, 149)

HSL

hsl(133, 12%, 61%)

HSB

hsb(133, 14%, 65%)

CMYK

cmyk(14%, 0%, 11%, 35%)

Oklch

oklch(70.5% 0.036 151.8)

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

#AA9884

Ginger · DarkGray · Warm Sun

HEX

#AA9884

RGB

rgb(170, 152, 132)

HSL

hsl(32, 18%, 59%)

HSB

hsb(32, 22%, 67%)

CMYK

cmyk(0%, 11%, 22%, 33%)

Oklch

oklch(69.0% 0.036 70.1)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#A4BCAF

Celadon · DarkGray · Apple Green

HEX

#A4BCAF

RGB

rgb(164, 188, 175)

HSL

hsl(147, 15%, 69%)

HSB

hsb(147, 13%, 74%)

CMYK

cmyk(13%, 0%, 7%, 26%)

Oklch

oklch(77.3% 0.032 162.0)

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

#DCD0C0

Goose Yellow · LightGray · Peach Orange

HEX

#DCD0C0

RGB

rgb(220, 208, 192)

HSL

hsl(34, 29%, 81%)

HSB

hsb(34, 13%, 86%)

CMYK

cmyk(0%, 5%, 13%, 14%)

Oklch

oklch(86.3% 0.025 75.2)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#FDEBD5

Goose Yellow · Beige · Peach Orange

HEX

#FDEBD5

RGB

rgb(253, 235, 213)

HSL

hsl(33, 91%, 91%)

HSB

hsb(33, 16%, 99%)

CMYK

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

Oklch

oklch(94.9% 0.035 72.9)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

90A795

A790A2

Analogous

96A790

90A795

90A7A1

Triadic

90A795

9590A7

A79590

Split-Comp.

90A795

A190A7

A79096

Tetradic

90A795

9096A7

A790A2

A7A190

Contrast Matrix WCAG 2.1 Contrast

90A795	AA9884	A4BCAF	DCD0C0	FDEBD5
—	1.1 Fail	1.3 Fail	1.7 Fail	2.2 Fail
1.1 Fail	—	1.4 Fail	1.8 Fail	2.4 Fail
1.3 Fail	1.4 Fail	—	1.3 Fail	1.7 Fail
1.7 Fail	1.8 Fail	1.3 Fail	—	1.3 Fail
2.2 Fail	2.4 Fail	1.7 Fail	1.3 Fail	—

White BG

2.6Fail

2.8Fail

2.0Fail

1.5Fail

1.2Fail

Black BG

8.1AAA

7.5AAA

10.4AAA

13.8AAA

18.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9A9A99

A2A289

AEAFB2

D7D7C4

F5F5DA

Deuteranopia

99979A

A3A58A

ADABB3

D8D8C5

F6F8DC

Tritanopia

919D9E

A98D8E

A5B5B5

DBC7C8

FCDFDF

Achromatopsia

9E9E9E

9B9B9B

B3B3B3

D2D2D2

EEEEEE

Shades & Tints Shades & Tints

#90A795

Dark

Light

#AA9884

Dark

Light

#A4BCAF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #90a795;
  --color-2: #aa9884;
  --color-3: #a4bcaf;
  --color-4: #dcd0c0;
  --color-5: #fdebd5;
}

SCSS

$color-1: #90a795;
$color-2: #aa9884;
$color-3: #a4bcaf;
$color-4: #dcd0c0;
$color-5: #fdebd5;

TAILWIND

colors: {
  'brand-1': '#90a795',
  'brand-2': '#aa9884',
  'brand-3': '#a4bcaf',
  'brand-4': '#dcd0c0',
  'brand-5': '#fdebd5',
}

RGB Array

[144, 167, 149], [170, 152, 132], [164, 188, 175], [220, 208, 192], [253, 235, 213]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #90A795, #AA9884, #A4BCAF, #DCD0C0, #FDEBD5 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: #90a795; --color-2: #aa9884; --color-3: #a4bcaf; --color-4: #dcd0c0; --color-5: #fdebd5. 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