← Back to Editor

#D7998A · #9E6F65 · #7E5C53 · #B16454 · #ED654D

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 Library

Color Details Color Details

#D7998A

Peach Pink · DarkSalmon · Coral Red

HEX
#D7998A
RGB
rgb(215, 153, 138)
HSL
hsl(12, 49%, 69%)
HSB
hsb(12, 36%, 84%)
CMYK
cmyk(0%, 29%, 36%, 16%)
Oklch
oklch(73.9% 0.078 34.1)

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

#9E6F65

Crimson · Gray · Passion Red

HEX
#9E6F65
RGB
rgb(158, 111, 101)
HSL
hsl(11, 23%, 51%)
HSB
hsb(11, 36%, 62%)
CMYK
cmyk(0%, 30%, 36%, 38%)
Oklch
oklch(58.7% 0.062 32.4)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#7E5C53

Crimson · DimGray · Passion Red

HEX
#7E5C53
RGB
rgb(126, 92, 83)
HSL
hsl(13, 21%, 41%)
HSB
hsb(13, 34%, 49%)
CMYK
cmyk(0%, 27%, 34%, 51%)
Oklch
oklch(50.8% 0.047 35.3)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#B16454

Crimson · Sienna · Passion Red

HEX
#B16454
RGB
rgb(177, 100, 84)
HSL
hsl(10, 37%, 51%)
HSB
hsb(10, 53%, 69%)
CMYK
cmyk(0%, 44%, 53%, 31%)
Oklch
oklch(58.7% 0.103 32.7)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#ED654D

Peach Pink · Tomato · Coral Red

HEX
#ED654D
RGB
rgb(237, 101, 77)
HSL
hsl(9, 82%, 62%)
HSB
hsb(9, 68%, 93%)
CMYK
cmyk(0%, 57%, 68%, 7%)
Oklch
oklch(67.2% 0.173 32.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D7998A
89C7D7

Analogous

D789A0
D7998A
D7BF89

Triadic

D7998A
89D799
9989D7

Split-Comp.

D7998A
89D7BF
89A0D7

Tetradic

D7998A
A0D789
89C7D7
BF89D7

Contrast Matrix WCAG 2.1 Contrast

D7998A
9E6F65
7E5C53
B16454
ED654D
—
1.8
Fail
2.5
Fail
1.8
Fail
1.3
Fail
1.8
Fail
—
1.4
Fail
1.0
Fail
1.3
Fail
2.5
Fail
1.4
Fail
—
1.4
Fail
1.9
Fail
1.8
Fail
1.0
Fail
1.4
Fail
—
1.4
Fail
1.3
Fail
1.3
Fail
1.9
Fail
1.4
Fail
—
White BG
2.4Fail
4.3AA Large
5.9AA
4.4AA Large
3.2AA Large
Black BG
8.8AAA
4.9AA
3.5AA Large
4.8AA
6.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BCBC8E
8A8967
6F6F55
908F58
B2B153

Deuteranopia

C0C48F
8C9068
717456
949A59
BAC454

Tritanopia

D49091
9C696A
7C5757
AD5B5C
E65758

Achromatopsia

AAAAAA
7C7C7C
656565
797979
8B8B8B

Shades & Tints Shades & Tints

#D7998A

Dark
Light

#9E6F65

Dark
Light

#7E5C53

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d7998a;
  --color-2: #9e6f65;
  --color-3: #7e5c53;
  --color-4: #b16454;
  --color-5: #ed654d;
}

SCSS

$color-1: #d7998a;
$color-2: #9e6f65;
$color-3: #7e5c53;
$color-4: #b16454;
$color-5: #ed654d;

TAILWIND

colors: {
  'brand-1': '#d7998a',
  'brand-2': '#9e6f65',
  'brand-3': '#7e5c53',
  'brand-4': '#b16454',
  'brand-5': '#ed654d',
}

RGB Array

[215, 153, 138], [158, 111, 101], [126, 92, 83], [177, 100, 84], [237, 101, 77]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #D7998A, #9E6F65, #7E5C53, #B16454, #ED654D 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: #d7998a; --color-2: #9e6f65; --color-3: #7e5c53; --color-4: #b16454; --color-5: #ed654d. 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