← Back to Editor

#C07C77 · #E46776 · #D70ED0 · #77898D · #288A8F

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#C07C77

Peach Pink · DarkSalmon · Coral Red

HEX
#C07C77
RGB
rgb(192, 124, 119)
HSL
hsl(4, 37%, 61%)
HSB
hsb(4, 38%, 75%)
CMYK
cmyk(0%, 35%, 38%, 25%)
Oklch
oklch(65.6% 0.086 24.3)

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

#E46776

Peach Pink · LightCoral · Coral Red

HEX
#E46776
RGB
rgb(228, 103, 118)
HSL
hsl(353, 70%, 65%)
HSB
hsb(353, 55%, 89%)
CMYK
cmyk(0%, 55%, 48%, 11%)
Oklch
oklch(67.0% 0.156 14.9)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#D70ED0

Rose Purple · Magenta · Violet

HEX
#D70ED0
RGB
rgb(215, 14, 208)
HSL
hsl(302, 88%, 45%)
HSB
hsb(302, 93%, 84%)
CMYK
cmyk(0%, 93%, 3%, 16%)
Oklch
oklch(61.5% 0.276 330.1)

Traditional「Rose Purple」· Paint「Violet」· Creative Blush Sunrise

#77898D

Slate Blue · SlateGray · Warm Gray

HEX
#77898D
RGB
rgb(119, 137, 141)
HSL
hsl(191, 9%, 51%)
HSB
hsb(191, 16%, 55%)
CMYK
cmyk(16%, 3%, 0%, 45%)
Oklch
oklch(61.7% 0.022 212.6)

Traditional「Slate Blue」· Paint「Warm Gray」· Creative Urban Concrete

#288A8F

Lake Blue · Teal · Mint Ice

HEX
#288A8F
RGB
rgb(40, 138, 143)
HSL
hsl(183, 56%, 36%)
HSB
hsb(183, 72%, 56%)
CMYK
cmyk(72%, 3%, 0%, 44%)
Oklch
oklch(58.1% 0.087 200.1)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C07C77
77BBC0

Analogous

C07797
C07C77
C0A077

Triadic

C07C77
77C07C
7C77C0

Split-Comp.

C07C77
77C0A0
7797C0

Tetradic

C07C77
97C077
77BBC0
A077C0

Contrast Matrix WCAG 2.1 Contrast

C07C77
E46776
D70ED0
77898D
288A8F
—
1.0
Fail
1.3
Fail
1.1
Fail
1.2
Fail
1.0
Fail
—
1.3
Fail
1.1
Fail
1.3
Fail
1.3
Fail
1.3
Fail
—
1.2
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.2
Fail
—
1.1
Fail
1.2
Fail
1.3
Fail
1.1
Fail
1.1
Fail
—
White BG
3.3AA Large
3.2AA Large
4.3AA Large
3.7AA Large
4.1AA Large
Black BG
6.4AA
6.5AA
4.9AA
5.7AA
5.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A3A278
AEAD72
807EA1
7F7F8C
52538E

Deuteranopia

A7AC79
B5BF72
8C9B96
7E7C8C
4D458E

Tritanopia

BD7979
DE706F
CD7C74
788B8B
2D8D8D

Achromatopsia

909090
8E8E8E
606060
848484
6D6D6D

Shades & Tints Shades & Tints

#C07C77

Dark
Light

#E46776

Dark
Light

#D70ED0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c07c77;
  --color-2: #e46776;
  --color-3: #d70ed0;
  --color-4: #77898d;
  --color-5: #288a8f;
}

SCSS

$color-1: #c07c77;
$color-2: #e46776;
$color-3: #d70ed0;
$color-4: #77898d;
$color-5: #288a8f;

TAILWIND

colors: {
  'brand-1': '#c07c77',
  'brand-2': '#e46776',
  'brand-3': '#d70ed0',
  'brand-4': '#77898d',
  'brand-5': '#288a8f',
}

RGB Array

[192, 124, 119], [228, 103, 118], [215, 14, 208], [119, 137, 141], [40, 138, 143]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C07C77, #E46776, #D70ED0, #77898D, #288A8F 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: #c07c77; --color-2: #e46776; --color-3: #d70ed0; --color-4: #77898d; --color-5: #288a8f. 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 general-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