#64B37E + #EDD4B2 + #A8C965 + #7A5E6B + #FF6C5E · 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

#64B37E

Celadon · CadetBlue · Olive Green

HEX

#64B37E

RGB

rgb(100, 179, 126)

HSL

hsl(140, 34%, 55%)

HSB

hsb(140, 44%, 70%)

CMYK

cmyk(44%, 0%, 30%, 30%)

Oklch

oklch(70.2% 0.111 153.3)

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

#EDD4B2

Goose Yellow · Wheat · Peach Orange

HEX

#EDD4B2

RGB

rgb(237, 212, 178)

HSL

hsl(35, 62%, 81%)

HSB

hsb(35, 25%, 93%)

CMYK

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

Oklch

oklch(88.2% 0.053 75.5)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#A8C965

Grass Green · DarkSeaGreen · Olive Green

HEX

#A8C965

RGB

rgb(168, 201, 101)

HSL

hsl(80, 48%, 59%)

HSB

hsb(80, 50%, 79%)

CMYK

cmyk(16%, 0%, 50%, 21%)

Oklch

oklch(79.0% 0.133 124.4)

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

#7A5E6B

Dark Violet · DimGray · Camellia

HEX

#7A5E6B

RGB

rgb(122, 94, 107)

HSL

hsl(332, 13%, 42%)

HSB

hsb(332, 23%, 48%)

CMYK

cmyk(0%, 23%, 12%, 52%)

Oklch

oklch(51.4% 0.041 349.1)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#FF6C5E

Peach Pink · Coral · Coral Red

HEX

#FF6C5E

RGB

rgb(255, 108, 94)

HSL

hsl(5, 100%, 68%)

HSB

hsb(5, 63%, 100%)

CMYK

cmyk(0%, 58%, 63%, 0%)

Oklch

oklch(71.1% 0.182 28.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

64B37E

B36599

Analogous

72B365

64B37E

65B3A6

Triadic

64B37E

7F65B3

B37F65

Split-Comp.

64B37E

A665B3

B36572

Tetradic

64B37E

6572B3

B36599

B3A665

Contrast Matrix WCAG 2.1 Contrast

64B37E	EDD4B2	A8C965	7A5E6B	FF6C5E
—	1.8 Fail	1.4 Fail	2.3 Fail	1.1 Fail
1.8 Fail	—	1.3 Fail	4.0 AA Large	1.9 Fail
1.4 Fail	1.3 Fail	—	3.1 AA Large	1.5 Fail
2.3 Fail	4.0 AA Large	3.1 AA Large	—	2.1 Fail
1.1 Fail	1.9 Fail	1.5 Fail	2.1 Fail	—

White BG

2.5Fail

1.4Fail

1.9Fail

5.8AA

2.8Fail

Black BG

8.3AAA

14.7AAA

11.2AAA

3.6AA Large

7.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

86878B

E2E2BA

B6B77D

6E6E68

BFBE61

Deuteranopia

827C8E

E4E5BC

B4B283

707267

C8D362

Tritanopia

689597

ECC1C2

AA9095

796565

F86465

Achromatopsia

959595

D8D8D8

B4B4B4

686868

969696

Shades & Tints Shades & Tints

#64B37E

Dark

Light

#EDD4B2

Dark

Light

#A8C965

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #64b37e;
  --color-2: #edd4b2;
  --color-3: #a8c965;
  --color-4: #7a5e6b;
  --color-5: #ff6c5e;
}

SCSS

$color-1: #64b37e;
$color-2: #edd4b2;
$color-3: #a8c965;
$color-4: #7a5e6b;
$color-5: #ff6c5e;

TAILWIND

colors: {
  'brand-1': '#64b37e',
  'brand-2': '#edd4b2',
  'brand-3': '#a8c965',
  'brand-4': '#7a5e6b',
  'brand-5': '#ff6c5e',
}

RGB Array

[100, 179, 126], [237, 212, 178], [168, 201, 101], [122, 94, 107], [255, 108, 94]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #64B37E, #EDD4B2, #A8C965, #7A5E6B, #FF6C5E 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: #64b37e; --color-2: #edd4b2; --color-3: #a8c965; --color-4: #7a5e6b; --color-5: #ff6c5e. 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