#98A37B + #96906C + #8E7755 + #7C523C + #641C10 · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#98A37B

Grass Green · DarkSeaGreen · Olive Green

HEX

#98A37B

RGB

rgb(152, 163, 123)

HSL

hsl(77, 18%, 56%)

HSB

hsb(77, 25%, 64%)

CMYK

cmyk(7%, 0%, 25%, 36%)

Oklch

oklch(69.6% 0.057 120.4)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#96906C

Autumn Sage · Gray · Sunflower

HEX

#96906C

RGB

rgb(150, 144, 108)

HSL

hsl(51, 17%, 51%)

HSB

hsb(51, 28%, 59%)

CMYK

cmyk(0%, 4%, 28%, 41%)

Oklch

oklch(64.9% 0.051 99.7)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#8E7755

Ochre · DimGray · Amber Brown

HEX

#8E7755

RGB

rgb(142, 119, 85)

HSL

hsl(36, 25%, 45%)

HSB

hsb(36, 40%, 56%)

CMYK

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

Oklch

oklch(58.2% 0.056 77.0)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#7C523C

Tangerine · Sienna · Amber Brown

HEX

#7C523C

RGB

rgb(124, 82, 60)

HSL

hsl(21, 35%, 36%)

HSB

hsb(21, 52%, 49%)

CMYK

cmyk(0%, 34%, 52%, 51%)

Oklch

oklch(48.0% 0.066 48.3)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#641C10

Vermilion · Maroon · Wine Red

HEX

#641C10

RGB

rgb(100, 28, 16)

HSL

hsl(9, 72%, 23%)

HSB

hsb(9, 84%, 39%)

CMYK

cmyk(0%, 72%, 84%, 61%)

Oklch

oklch(34.2% 0.106 32.0)

Traditional「Vermilion」· Paint「Wine Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

98A37B

867BA3

Analogous

A39A7B

98A37B

83A37B

Triadic

98A37B

7B98A3

A37B98

Split-Comp.

98A37B

7B83A3

9A7BA3

Tetradic

98A37B

7BA39A

867BA3

A37B83

Contrast Matrix WCAG 2.1 Contrast

98A37B	96906C	8E7755	7C523C	641C10
—	1.2 Fail	1.6 Fail	2.5 Fail	4.6 AA
1.2 Fail	—	1.3 Fail	2.1 Fail	3.8 AA Large
1.6 Fail	1.3 Fail	—	1.6 Fail	2.9 Fail
2.5 Fail	2.1 Fail	1.6 Fail	—	1.8 Fail
4.6 AA	3.8 AA Large	2.9 Fail	1.8 Fail	—

White BG

2.7Fail

3.2AA Large

4.3AA Large

6.7AA

12.2AAA

Black BG

7.9AAA

6.5AA

4.9AA

3.1AA Large

1.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

9D9D85

939375

84845D

6A6941

454413

Deuteranopia

9C9B87

949477

85875F

6C6F43

494E14

Tritanopia

998C8E

967C7D

8D6465

7A4646

601516

Achromatopsia

9B9B9B

8E8E8E

7A7A7A

5C5C5C

303030

Shades & Tints Shades & Tints

#98A37B

Dark

Light

#96906C

Dark

Light

#8E7755

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #98a37b;
  --color-2: #96906c;
  --color-3: #8e7755;
  --color-4: #7c523c;
  --color-5: #641c10;
}

SCSS

$color-1: #98a37b;
$color-2: #96906c;
$color-3: #8e7755;
$color-4: #7c523c;
$color-5: #641c10;

TAILWIND

colors: {
  'brand-1': '#98a37b',
  'brand-2': '#96906c',
  'brand-3': '#8e7755',
  'brand-4': '#7c523c',
  'brand-5': '#641c10',
}

RGB Array

[152, 163, 123], [150, 144, 108], [142, 119, 85], [124, 82, 60], [100, 28, 16]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #98A37B, #96906C, #8E7755, #7C523C, #641C10 is ideal for: corporate websites, product showcases, portfolios. 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: #98a37b; --color-2: #96906c; --color-3: #8e7755; --color-4: #7c523c; --color-5: #641c10. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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