← Back to Editor

#593E35 · #67654E · #747D5E · #97AB78 · #D2E2A3

sea

A 5-color sea palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#593E35

Tangerine · DarkOliveGreen · Amber Brown

HEX
#593E35
RGB
rgb(89, 62, 53)
HSL
hsl(15, 25%, 28%)
HSB
hsb(15, 40%, 35%)
CMYK
cmyk(0%, 30%, 40%, 65%)
Oklch
oklch(39.2% 0.041 39.2)

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

#67654E

Autumn Sage · DimGray · Honey Gold

HEX
#67654E
RGB
rgb(103, 101, 78)
HSL
hsl(55, 14%, 35%)
HSB
hsb(55, 24%, 40%)
CMYK
cmyk(0%, 2%, 24%, 60%)
Oklch
oklch(50.2% 0.035 103.4)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#747D5E

Grass Green · DimGray · Olive Green

HEX
#747D5E
RGB
rgb(116, 125, 94)
HSL
hsl(77, 14%, 43%)
HSB
hsb(77, 25%, 49%)
CMYK
cmyk(7%, 0%, 25%, 51%)
Oklch
oklch(57.4% 0.047 121.0)

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

#97AB78

Grass Green · DarkSeaGreen · Olive Green

HEX
#97AB78
RGB
rgb(151, 171, 120)
HSL
hsl(84, 23%, 57%)
HSB
hsb(84, 30%, 67%)
CMYK
cmyk(12%, 0%, 30%, 33%)
Oklch
oklch(71.3% 0.074 125.6)

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

#D2E2A3

Willow Green · Khaki · Apple Green

HEX
#D2E2A3
RGB
rgb(210, 226, 163)
HSL
hsl(75, 52%, 76%)
HSB
hsb(75, 28%, 89%)
CMYK
cmyk(7%, 0%, 28%, 11%)
Oklch
oklch(88.5% 0.084 119.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

593E35
365059

Analogous

59363E
593E35
595036

Triadic

593E35
36593E
3E3659

Split-Comp.

593E35
365950
363E59

Tetradic

593E35
3E5936
365059
503659

Contrast Matrix WCAG 2.1 Contrast

593E35
67654E
747D5E
97AB78
D2E2A3
—
1.6
Fail
2.2
Fail
3.9
AA Large
7.0
AA
1.6
Fail
—
1.4
Fail
2.4
Fail
4.3
AA Large
2.2
Fail
1.4
Fail
—
1.7
Fail
3.1
AA Large
3.9
AA Large
2.4
Fail
1.7
Fail
—
1.8
Fail
7.0
AA
4.3
AA Large
3.1
AA Large
1.8
Fail
—
White BG
9.7AAA
5.9AA
4.3AA Large
2.5Fail
1.4Fail
Black BG
2.2Fail
3.5AA Large
4.8AA
8.4AAA
15.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4D4D37
666654
787866
A0A084
D9D9B2

Deuteranopia

4F5138
666655
777767
9F9D87
D8D7B6

Tritanopia

583939
675859
746B6D
988E90
D3BEC1

Achromatopsia

454545
636363
777777
9F9F9F
D6D6D6

Shades & Tints Shades & Tints

#593E35

Dark
Light

#67654E

Dark
Light

#747D5E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #593e35;
  --color-2: #67654e;
  --color-3: #747d5e;
  --color-4: #97ab78;
  --color-5: #d2e2a3;
}

SCSS

$color-1: #593e35;
$color-2: #67654e;
$color-3: #747d5e;
$color-4: #97ab78;
$color-5: #d2e2a3;

TAILWIND

colors: {
  'brand-1': '#593e35',
  'brand-2': '#67654e',
  'brand-3': '#747d5e',
  'brand-4': '#97ab78',
  'brand-5': '#d2e2a3',
}

RGB Array

[89, 62, 53], [103, 101, 78], [116, 125, 94], [151, 171, 120], [210, 226, 163]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #593E35, #67654E, #747D5E, #97AB78, #D2E2A3 is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #593e35; --color-2: #67654e; --color-3: #747d5e; --color-4: #97ab78; --color-5: #d2e2a3. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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. Restrained colors convey professionalism and trust. 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