#89836A + #82AD9E + #A1E1B7 + #CAE9B3 + #EEEAB4 · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#89836A

Ochre · Gray · Honey Gold

HEX

#89836A

RGB

rgb(137, 131, 106)

HSL

hsl(48, 13%, 48%)

HSB

hsb(48, 23%, 54%)

CMYK

cmyk(0%, 4%, 23%, 46%)

Oklch

oklch(60.8% 0.037 96.1)

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

#82AD9E

Mineral Blue · DarkSeaGreen · Olive Green

HEX

#82AD9E

RGB

rgb(130, 173, 158)

HSL

hsl(159, 21%, 59%)

HSB

hsb(159, 25%, 68%)

CMYK

cmyk(25%, 0%, 9%, 32%)

Oklch

oklch(71.2% 0.051 171.3)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#A1E1B7

Emerald · LightGreen · Apple Green

HEX

#A1E1B7

RGB

rgb(161, 225, 183)

HSL

hsl(141, 52%, 76%)

HSB

hsb(141, 28%, 88%)

CMYK

cmyk(28%, 0%, 19%, 12%)

Oklch

oklch(85.5% 0.087 155.4)

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

#CAE9B3

Emerald · LightGray · Mint Green

HEX

#CAE9B3

RGB

rgb(202, 233, 179)

HSL

hsl(94, 55%, 81%)

HSB

hsb(94, 23%, 91%)

CMYK

cmyk(13%, 0%, 23%, 9%)

Oklch

oklch(89.8% 0.079 132.2)

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

#EEEAB4

Fresh Green · Wheat · Lemon Cream

HEX

#EEEAB4

RGB

rgb(238, 234, 180)

HSL

hsl(56, 63%, 82%)

HSB

hsb(56, 24%, 93%)

CMYK

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

Oklch

oklch(92.7% 0.070 104.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

89836A

6A718A

Analogous

8A746A

89836A

818A6A

Triadic

89836A

6A8A84

846A8A

Split-Comp.

89836A

6A818A

746A8A

Tetradic

89836A

6A8A74

6A718A

8A6A81

Contrast Matrix WCAG 2.1 Contrast

89836A	82AD9E	A1E1B7	CAE9B3	EEEAB4
—	1.5 Fail	2.5 Fail	2.9 Fail	3.1 AA Large
1.5 Fail	—	1.7 Fail	1.9 Fail	2.0 Fail
2.5 Fail	1.7 Fail	—	1.1 Fail	1.2 Fail
2.9 Fail	1.9 Fail	1.1 Fail	—	1.1 Fail
3.1 AA Large	2.0 Fail	1.2 Fail	1.1 Fail	—

White BG

3.8AA Large

2.5Fail

1.5Fail

1.3Fail

1.2Fail

Black BG

5.5AA

8.4AAA

14.0AAA

15.8AAA

17.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

868670

9595A2

BDBDC1

D7D8C0

ECECC1

Deuteranopia

878771

928FA3

B9B4C4

D6D3C3

EDEDC4

Tritanopia

897576

84A4A5

A4C9CB

CCCACD

EECBCE

Achromatopsia

828282

9E9E9E

C9C9C9

DADADA

E5E5E5

Shades & Tints Shades & Tints

#89836A

Dark

Light

#82AD9E

Dark

Light

#A1E1B7

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #89836a;
  --color-2: #82ad9e;
  --color-3: #a1e1b7;
  --color-4: #cae9b3;
  --color-5: #eeeab4;
}

SCSS

$color-1: #89836a;
$color-2: #82ad9e;
$color-3: #a1e1b7;
$color-4: #cae9b3;
$color-5: #eeeab4;

TAILWIND

colors: {
  'brand-1': '#89836a',
  'brand-2': '#82ad9e',
  'brand-3': '#a1e1b7',
  'brand-4': '#cae9b3',
  'brand-5': '#eeeab4',
}

RGB Array

[137, 131, 106], [130, 173, 158], [161, 225, 183], [202, 233, 179], [238, 234, 180]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #89836A, #82AD9E, #A1E1B7, #CAE9B3, #EEEAB4 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: #89836a; --color-2: #82ad9e; --color-3: #a1e1b7; --color-4: #cae9b3; --color-5: #eeeab4. 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 sea-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