#90797E + #B5CBB7 + #D2E4C4 + #E4E9B2 + #E7E08B · earth - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#90797E

Crimson · Gray · Warm Gray

HEX

#90797E

RGB

rgb(144, 121, 126)

HSL

hsl(347, 9%, 52%)

HSB

hsb(347, 16%, 56%)

CMYK

cmyk(0%, 16%, 12%, 44%)

Oklch

oklch(59.9% 0.029 3.3)

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

#B5CBB7

Celadon · Silver · Apple Green

HEX

#B5CBB7

RGB

rgb(181, 203, 183)

HSL

hsl(125, 17%, 75%)

HSB

hsb(125, 11%, 80%)

CMYK

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

Oklch

oklch(82.0% 0.036 147.8)

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

#D2E4C4

Celadon · LightGray · Mint Green

HEX

#D2E4C4

RGB

rgb(210, 228, 196)

HSL

hsl(94, 37%, 83%)

HSB

hsb(94, 14%, 89%)

CMYK

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

Oklch

oklch(89.7% 0.047 131.4)

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

#E4E9B2

Fresh Green · Wheat · Lemon Cream

HEX

#E4E9B2

RGB

rgb(228, 233, 178)

HSL

hsl(65, 56%, 81%)

HSB

hsb(65, 24%, 91%)

CMYK

cmyk(2%, 0%, 24%, 9%)

Oklch

oklch(91.7% 0.072 112.0)

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

#E7E08B

Fresh Green · Khaki · Sunflower

HEX

#E7E08B

RGB

rgb(231, 224, 139)

HSL

hsl(55, 66%, 73%)

HSB

hsb(55, 40%, 91%)

CMYK

cmyk(0%, 3%, 40%, 9%)

Oklch

oklch(89.4% 0.107 104.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

90797E

7A908B

Analogous

907A89

90797E

90807A

Triadic

90797E

7E907A

7A7E90

Split-Comp.

90797E

7A9080

7A8990

Tetradic

90797E

89907A

7A908B

807A90

Contrast Matrix WCAG 2.1 Contrast

90797E	B5CBB7	D2E4C4	E4E9B2	E7E08B
—	2.3 Fail	3.0 Fail	3.2 AA Large	3.0 Fail
2.3 Fail	—	1.3 Fail	1.4 Fail	1.3 Fail
3.0 Fail	1.3 Fail	—	1.1 Fail	1.0 Fail
3.2 AA Large	1.4 Fail	1.1 Fail	—	1.1 Fail
3.0 Fail	1.3 Fail	1.0 Fail	1.1 Fail	—

White BG

4.0AA Large

1.7Fail

1.3Fail

1.4Fail

Black BG

5.2AA

12.2AAA

15.6AAA

16.6AAA

15.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

86867D

BFBFBC

DADACC

E6E6BF

E4E4A0

Deuteranopia

87897C

BDBCBD

D9D7CE

E6E6C3

E4E5A5

Tritanopia

8F7C7C

B6C0C1

D3D2D3

E4CACC

E7B0B3

Achromatopsia

808080

C2C2C2

DBDBDB

E1E1E1

D8D8D8

Shades & Tints Shades & Tints

#90797E

Dark

Light

#B5CBB7

Dark

Light

#D2E4C4

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #90797e;
  --color-2: #b5cbb7;
  --color-3: #d2e4c4;
  --color-4: #e4e9b2;
  --color-5: #e7e08b;
}

SCSS

$color-1: #90797e;
$color-2: #b5cbb7;
$color-3: #d2e4c4;
$color-4: #e4e9b2;
$color-5: #e7e08b;

TAILWIND

colors: {
  'brand-1': '#90797e',
  'brand-2': '#b5cbb7',
  'brand-3': '#d2e4c4',
  'brand-4': '#e4e9b2',
  'brand-5': '#e7e08b',
}

RGB Array

[144, 121, 126], [181, 203, 183], [210, 228, 196], [228, 233, 178], [231, 224, 139]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #90797E, #B5CBB7, #D2E4C4, #E4E9B2, #E7E08B 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: #90797e; --color-2: #b5cbb7; --color-3: #d2e4c4; --color-4: #e4e9b2; --color-5: #e7e08b. 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 earth-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