#A39676 + #96C0A8 + #B0D6BF + #EBD7B4 + #CCBB87 · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A39676

Ginger · Gray · Sunflower

HEX

#A39676

RGB

rgb(163, 150, 118)

HSL

hsl(43, 20%, 55%)

HSB

hsb(43, 28%, 64%)

CMYK

cmyk(0%, 8%, 28%, 36%)

Oklch

oklch(67.6% 0.047 88.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#96C0A8

Celadon · DarkSeaGreen · Apple Green

HEX

#96C0A8

RGB

rgb(150, 192, 168)

HSL

hsl(146, 25%, 67%)

HSB

hsb(146, 22%, 75%)

CMYK

cmyk(22%, 0%, 13%, 25%)

Oklch

oklch(77.1% 0.056 159.7)

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

#B0D6BF

Celadon · Silver · Apple Green

HEX

#B0D6BF

RGB

rgb(176, 214, 191)

HSL

hsl(144, 32%, 76%)

HSB

hsb(144, 18%, 84%)

CMYK

cmyk(18%, 0%, 11%, 16%)

Oklch

oklch(84.2% 0.051 158.5)

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

#EBD7B4

Goose Yellow · Wheat · Peach Orange

HEX

#EBD7B4

RGB

rgb(235, 215, 180)

HSL

hsl(38, 58%, 81%)

HSB

hsb(38, 23%, 92%)

CMYK

cmyk(0%, 9%, 23%, 8%)

Oklch

oklch(88.7% 0.051 81.6)

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

#CCBB87

Ginger · Tan · Sunflower

HEX

#CCBB87

RGB

rgb(204, 187, 135)

HSL

hsl(45, 40%, 66%)

HSB

hsb(45, 34%, 80%)

CMYK

cmyk(0%, 8%, 34%, 20%)

Oklch

oklch(79.4% 0.071 92.1)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A39676

7582A3

Analogous

A37F75

A39676

99A375

Triadic

A39676

75A396

9675A3

Split-Comp.

A39676

7599A3

7F75A3

Tetradic

A39676

75A37F

7582A3

A37599

Contrast Matrix WCAG 2.1 Contrast

A39676	96C0A8	B0D6BF	EBD7B4	CCBB87
—	1.4 Fail	1.8 Fail	2.1 Fail	1.5 Fail
1.4 Fail	—	1.3 Fail	1.4 Fail	1.1 Fail
1.8 Fail	1.3 Fail	—	1.1 Fail	1.2 Fail
2.1 Fail	1.4 Fail	1.1 Fail	—	1.4 Fail
1.5 Fail	1.1 Fail	1.2 Fail	1.4 Fail	—

White BG

2.9Fail

2.0Fail

1.6Fail

1.4Fail

1.9Fail

Black BG

7.2AAA

10.4AAA

13.2AAA

14.9AAA

11.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9D9D7E

A8A9AE

C0C1C5

E2E2BC

C5C494

Deuteranopia

9E9F80

A6A3AF

BEBBC6

E4E5BF

C6C797

Tritanopia

A28485

98B2B3

B2C9CA

EAC3C5

CB9EA0

Achromatopsia

969696

B1B1B1

C8C8C8

D9D9D9

BABABA

Shades & Tints Shades & Tints

#A39676

Dark

Light

#96C0A8

Dark

Light

#B0D6BF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a39676;
  --color-2: #96c0a8;
  --color-3: #b0d6bf;
  --color-4: #ebd7b4;
  --color-5: #ccbb87;
}

SCSS

$color-1: #a39676;
$color-2: #96c0a8;
$color-3: #b0d6bf;
$color-4: #ebd7b4;
$color-5: #ccbb87;

TAILWIND

colors: {
  'brand-1': '#a39676',
  'brand-2': '#96c0a8',
  'brand-3': '#b0d6bf',
  'brand-4': '#ebd7b4',
  'brand-5': '#ccbb87',
}

RGB Array

[163, 150, 118], [150, 192, 168], [176, 214, 191], [235, 215, 180], [204, 187, 135]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #A39676, #96C0A8, #B0D6BF, #EBD7B4, #CCBB87 is ideal for: health products, baby brands, fresh-style blogs. 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: #a39676; --color-2: #96c0a8; --color-3: #b0d6bf; --color-4: #ebd7b4; --color-5: #ccbb87. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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