← Back to Editor

#E7E9E8 · #56CD26 · #288244 · #33302B · #F54104

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

#E7E9E8

Plain White · Lavender · Cloud White

HEX
#E7E9E8
RGB
rgb(231, 233, 232)
HSL
hsl(150, 4%, 91%)
HSB
hsb(150, 1%, 91%)
CMYK
cmyk(1%, 0%, 0%, 9%)
Oklch
oklch(93.2% 0.003 165.1)

Traditional「Plain White」· Paint「Cloud White」· Creative Morning Mist

#56CD26

Pine Green · LimeGreen · Olive Green

HEX
#56CD26
RGB
rgb(86, 205, 38)
HSL
hsl(103, 69%, 48%)
HSB
hsb(103, 81%, 80%)
CMYK
cmyk(58%, 0%, 81%, 20%)
Oklch
oklch(75.1% 0.222 138.9)

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

#288244

Pine Green · SeaGreen · Forest Green

HEX
#288244
RGB
rgb(40, 130, 68)
HSL
hsl(139, 53%, 33%)
HSB
hsb(139, 69%, 51%)
CMYK
cmyk(69%, 0%, 48%, 49%)
Oklch
oklch(53.8% 0.127 150.0)

Traditional「Pine Green」· Paint「Forest Green」· Creative Blush Sunrise

#33302B

Ochre · DarkSlateGray · Dark Stone

HEX
#33302B
RGB
rgb(51, 48, 43)
HSL
hsl(37, 9%, 18%)
HSB
hsb(37, 16%, 20%)
CMYK
cmyk(0%, 6%, 16%, 80%)
Oklch
oklch(31.1% 0.010 80.7)

Traditional「Ochre」· Paint「Dark Stone」· Creative Midnight Shadow

#F54104

Tangerine · OrangeRed · Amber Brown

HEX
#F54104
RGB
rgb(245, 65, 4)
HSL
hsl(15, 97%, 49%)
HSB
hsb(15, 98%, 96%)
CMYK
cmyk(0%, 73%, 98%, 4%)
Oklch
oklch(64.0% 0.223 35.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E7E9E8
E9E7E8

Analogous

E7E9E7
E7E9E8
E7E9E9

Triadic

E7E9E8
E8E7E9
E9E8E7

Split-Comp.

E7E9E8
E9E7E9
E9E7E7

Tetradic

E7E9E8
E7E7E9
E9E7E8
E9E9E7

Contrast Matrix WCAG 2.1 Contrast

E7E9E8
56CD26
288244
33302B
F54104
—
1.7
Fail
3.9
AA Large
10.8
AAA
3.1
AA Large
1.7
Fail
—
2.3
Fail
6.4
AA
1.8
Fail
3.9
AA Large
2.3
Fail
—
2.7
Fail
1.3
Fail
10.8
AAA
6.4
AA
2.7
Fail
—
3.5
AA Large
3.1
AA Large
1.8
Fail
1.3
Fail
3.5
AA Large
—
White BG
1.2Fail
2.1Fail
4.8AA
13.1AAA
3.7AA Large
Black BG
17.2AAA
10.2AAA
4.4AA Large
1.6Fail
5.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E8E8E8
8A8B4E
4F5053
32322C
A7A513

Deuteranopia

E8E8E8
837A58
4A4357
32322D
B2BF16

Tritanopia

E7E8E8
5C6E75
2D5F61
332D2D
EC1E21

Achromatopsia

E8E8E8
969696
606060
303030
707070

Shades & Tints Shades & Tints

#E7E9E8

Dark
Light

#56CD26

Dark
Light

#288244

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e7e9e8;
  --color-2: #56cd26;
  --color-3: #288244;
  --color-4: #33302b;
  --color-5: #f54104;
}

SCSS

$color-1: #e7e9e8;
$color-2: #56cd26;
$color-3: #288244;
$color-4: #33302b;
$color-5: #f54104;

TAILWIND

colors: {
  'brand-1': '#e7e9e8',
  'brand-2': '#56cd26',
  'brand-3': '#288244',
  'brand-4': '#33302b',
  'brand-5': '#f54104',
}

RGB Array

[231, 233, 232], [86, 205, 38], [40, 130, 68], [51, 48, 43], [245, 65, 4]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #E7E9E8, #56CD26, #288244, #33302B, #F54104 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #e7e9e8; --color-2: #56cd26; --color-3: #288244; --color-4: #33302b; --color-5: #f54104. 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. 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