#7C6C6C + #C48E86 + #E7978E + #DEBC95 + #D2D2A0 · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#7C6C6C

Ink Gray · DimGray · Warm Gray

HEX

#7C6C6C

RGB

rgb(124, 108, 108)

HSL

hsl(0, 7%, 45%)

HSB

hsb(0, 13%, 49%)

CMYK

cmyk(0%, 13%, 13%, 51%)

Oklch

oklch(54.6% 0.020 17.8)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#C48E86

Peach Pink · DarkSalmon · Coral Red

HEX

#C48E86

RGB

rgb(196, 142, 134)

HSL

hsl(8, 34%, 65%)

HSB

hsb(8, 32%, 77%)

CMYK

cmyk(0%, 28%, 32%, 23%)

Oklch

oklch(69.7% 0.067 28.4)

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

#E7978E

Peach Pink · DarkSalmon · Coral Red

HEX

#E7978E

RGB

rgb(231, 151, 142)

HSL

hsl(6, 65%, 73%)

HSB

hsb(6, 39%, 91%)

CMYK

cmyk(0%, 35%, 39%, 9%)

Oklch

oklch(75.4% 0.098 26.6)

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

#DEBC95

Goose Yellow · BurlyWood · Warm Sun

HEX

#DEBC95

RGB

rgb(222, 188, 149)

HSL

hsl(32, 53%, 73%)

HSB

hsb(32, 33%, 87%)

CMYK

cmyk(0%, 15%, 33%, 13%)

Oklch

oklch(81.5% 0.065 70.6)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#D2D2A0

Fresh Green · Tan · Sunflower

HEX

#D2D2A0

RGB

rgb(210, 210, 160)

HSL

hsl(60, 36%, 73%)

HSB

hsb(60, 24%, 82%)

CMYK

cmyk(0%, 0%, 24%, 18%)

Oklch

oklch(85.1% 0.066 107.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7C6C6C

6B7B7B

Analogous

7B6B73

7C6C6C

7B736B

Triadic

7C6C6C

6B7B6B

6B6B7B

Split-Comp.

7C6C6C

6B7B73

6B737B

Tetradic

7C6C6C

737B6B

6B7B7B

736B7B

Contrast Matrix WCAG 2.1 Contrast

7C6C6C	C48E86	E7978E	DEBC95	D2D2A0
—	1.8 Fail	2.2 Fail	2.8 Fail	3.2 AA Large
1.8 Fail	—	1.2 Fail	1.6 Fail	1.8 Fail
2.2 Fail	1.2 Fail	—	1.3 Fail	1.5 Fail
2.8 Fail	1.6 Fail	1.3 Fail	—	1.1 Fail
3.2 AA Large	1.8 Fail	1.5 Fail	1.1 Fail	—

White BG

5.0AA

2.8Fail

2.3Fail

1.8Fail

1.6Fail

Black BG

4.2AA Large

7.6AAA

9.2AAA

11.7AAA

13.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

75756C

ADAC88

C4C490

CFCF9E

D2D2AC

Deuteranopia

76776C

B0B488

C9CF91

D1D4A1

D2D2AF

Tritanopia

7B6C6C

C1898A

E39292

DCA6A8

D2B6B8

Achromatopsia

717171

9D9D9D

AEAEAE

C2C2C2

CCCCCC

Shades & Tints Shades & Tints

#7C6C6C

Dark

Light

#C48E86

Dark

Light

#E7978E

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7c6c6c;
  --color-2: #c48e86;
  --color-3: #e7978e;
  --color-4: #debc95;
  --color-5: #d2d2a0;
}

SCSS

$color-1: #7c6c6c;
$color-2: #c48e86;
$color-3: #e7978e;
$color-4: #debc95;
$color-5: #d2d2a0;

TAILWIND

colors: {
  'brand-1': '#7c6c6c',
  'brand-2': '#c48e86',
  'brand-3': '#e7978e',
  'brand-4': '#debc95',
  'brand-5': '#d2d2a0',
}

RGB Array

[124, 108, 108], [196, 142, 134], [231, 151, 142], [222, 188, 149], [210, 210, 160]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #7C6C6C, #C48E86, #E7978E, #DEBC95, #D2D2A0 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: #7c6c6c; --color-2: #c48e86; --color-3: #e7978e; --color-4: #debc95; --color-5: #d2d2a0. 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