#8595A6 + #6B596A + #C97871 + #FFA575 + #FFF18A · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#8595A6

Azure · LightSlateGray · Navy Blue

HEX

#8595A6

RGB

rgb(133, 149, 166)

HSL

hsl(211, 16%, 59%)

HSB

hsb(211, 20%, 65%)

CMYK

cmyk(20%, 10%, 0%, 35%)

Oklch

oklch(66.3% 0.031 249.9)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#6B596A

Rose Purple · DimGray · Charcoal

HEX

#6B596A

RGB

rgb(107, 89, 106)

HSL

hsl(303, 9%, 38%)

HSB

hsb(303, 17%, 42%)

CMYK

cmyk(0%, 17%, 1%, 58%)

Oklch

oklch(48.8% 0.035 327.9)

Traditional「Rose Purple」· Paint「Charcoal」· Creative Midnight Shadow

#C97871

Peach Pink · LightCoral · Coral Red

HEX

#C97871

RGB

rgb(201, 120, 113)

HSL

hsl(5, 45%, 62%)

HSB

hsb(5, 44%, 79%)

CMYK

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

Oklch

oklch(65.8% 0.103 25.5)

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

#FFA575

Apricot · LightSalmon · Warm Sun

HEX

#FFA575

RGB

rgb(255, 165, 117)

HSL

hsl(21, 100%, 73%)

HSB

hsb(21, 54%, 100%)

CMYK

cmyk(0%, 35%, 54%, 0%)

Oklch

oklch(80.1% 0.124 48.4)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#FFF18A

Fresh Green · Khaki · Lemon Cream

HEX

#FFF18A

RGB

rgb(255, 241, 138)

HSL

hsl(53, 100%, 77%)

HSB

hsb(53, 46%, 100%)

CMYK

cmyk(0%, 5%, 46%, 0%)

Oklch

oklch(94.8% 0.125 101.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8595A6

A79786

Analogous

86A7A7

8595A6

8686A7

Triadic

8595A6

A78696

96A786

Split-Comp.

8595A6

A78686

A7A786

Tetradic

8595A6

A786A7

A79786

86A786

Contrast Matrix WCAG 2.1 Contrast

8595A6	6B596A	C97871	FFA575	FFF18A
—	2.1 Fail	1.1 Fail	1.6 Fail	2.7 Fail
2.1 Fail	—	2.0 Fail	3.3 AA Large	5.6 AA
1.1 Fail	2.0 Fail	—	1.7 Fail	2.8 Fail
1.6 Fail	3.3 AA Large	1.7 Fail	—	1.7 Fail
2.7 Fail	5.6 AA	2.8 Fail	1.7 Fail	—

White BG

3.1AA Large

6.4AA

3.3AA Large

1.9Fail

1.2Fail

Black BG

6.8AA

3.3AA Large

6.4AA

10.9AAA

18.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8C8CA2

636366

A6A573

D8D781

F9F9A3

Deuteranopia

8B8AA1

646665

ABB173

DDE483

FAFBA9

Tritanopia

869F9E

6A6362

C57474

FB8A8C

FEB7BB

Achromatopsia

929292

606060

8F8F8F

BABABA

E9E9E9

Shades & Tints Shades & Tints

#8595A6

Dark

Light

#6B596A

Dark

Light

#C97871

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8595a6;
  --color-2: #6b596a;
  --color-3: #c97871;
  --color-4: #ffa575;
  --color-5: #fff18a;
}

SCSS

$color-1: #8595a6;
$color-2: #6b596a;
$color-3: #c97871;
$color-4: #ffa575;
$color-5: #fff18a;

TAILWIND

colors: {
  'brand-1': '#8595a6',
  'brand-2': '#6b596a',
  'brand-3': '#c97871',
  'brand-4': '#ffa575',
  'brand-5': '#fff18a',
}

RGB Array

[133, 149, 166], [107, 89, 106], [201, 120, 113], [255, 165, 117], [255, 241, 138]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #8595A6, #6B596A, #C97871, #FFA575, #FFF18A 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: #8595a6; --color-2: #6b596a; --color-3: #c97871; --color-4: #ffa575; --color-5: #fff18a. 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