← Back to Editor

#6E798C · #B39490 · #CE8288 · #DE7880 · #F3677F

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

#6E798C

Indigo · SlateGray · Navy Blue

HEX
#6E798C
RGB
rgb(110, 121, 140)
HSL
hsl(218, 12%, 49%)
HSB
hsb(218, 21%, 55%)
CMYK
cmyk(21%, 14%, 0%, 45%)
Oklch
oklch(57.4% 0.032 261.4)

TraditionalIndigo」· PaintNavy Blue」· Creative Blush Sunrise

#B39490

Peach Pink · DarkGray · Coral Red

HEX
#B39490
RGB
rgb(179, 148, 144)
HSL
hsl(7, 19%, 63%)
HSB
hsb(7, 20%, 70%)
CMYK
cmyk(0%, 17%, 20%, 30%)
Oklch
oklch(69.4% 0.038 26.7)

TraditionalPeach Pink」· PaintCoral Red」· Creative Blush Sunrise

#CE8288

Peach Pink · LightCoral · Coral Red

HEX
#CE8288
RGB
rgb(206, 130, 136)
HSL
hsl(355, 44%, 66%)
HSB
hsb(355, 37%, 81%)
CMYK
cmyk(0%, 37%, 34%, 19%)
Oklch
oklch(68.7% 0.094 14.7)

TraditionalPeach Pink」· PaintCoral Red」· Creative Rose Petal

#DE7880

Peach Pink · LightCoral · Coral Red

HEX
#DE7880
RGB
rgb(222, 120, 128)
HSL
hsl(355, 61%, 67%)
HSB
hsb(355, 46%, 87%)
CMYK
cmyk(0%, 46%, 42%, 13%)
Oklch
oklch(68.9% 0.127 16.0)

TraditionalPeach Pink」· PaintCoral Red」· Creative Rose Petal

#F3677F

Peach Pink · LightCoral · Coral Red

HEX
#F3677F
RGB
rgb(243, 103, 127)
HSL
hsl(350, 85%, 68%)
HSB
hsb(350, 58%, 95%)
CMYK
cmyk(0%, 58%, 48%, 5%)
Oklch
oklch(69.3% 0.173 12.3)

TraditionalPeach Pink」· PaintCoral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6E798C
8C816E

Analogous

6E888C
6E798C
726E8C

Triadic

6E798C
8C6E79
798C6E

Split-Comp.

6E798C
8C726E
888C6E

Tetradic

6E798C
8C6E88
8C816E
6E8C72

Contrast Matrix WCAG 2.1 Contrast

6E798C
B39490
CE8288
DE7880
F3677F
1.6
Fail
1.5
Fail
1.5
Fail
1.5
Fail
1.6
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.5
Fail
1.1
Fail
1.0
Fail
1.0
Fail
1.5
Fail
1.1
Fail
1.0
Fail
1.0
Fail
1.5
Fail
1.1
Fail
1.0
Fail
1.0
Fail
White BG
4.4AA Large
2.8Fail
2.9Fail
3.0Fail
3.0Fail
Black BG
4.8AA
7.6AAA
7.2AAA
7.1AAA
7.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

737387
A6A591
ADAC87
B2B17E
B6B579

Deuteranopia

727186
A7AA91
B2B786
B8BF7E
BFC978

Tritanopia

6F8483
B19292
CA8585
D97D7C
EC7574

Achromatopsia

787878
9D9D9D
999999
979797
949494

Shades & Tints Shades & Tints

#6E798C

Dark
Light

#B39490

Dark
Light

#CE8288

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6e798c;
  --color-2: #b39490;
  --color-3: #ce8288;
  --color-4: #de7880;
  --color-5: #f3677f;
}

SCSS

$color-1: #6e798c;
$color-2: #b39490;
$color-3: #ce8288;
$color-4: #de7880;
$color-5: #f3677f;

TAILWIND

colors: {
  'brand-1': '#6e798c',
  'brand-2': '#b39490',
  'brand-3': '#ce8288',
  'brand-4': '#de7880',
  'brand-5': '#f3677f',
}

RGB Array

[110, 121, 140], [179, 148, 144], [206, 130, 136], [222, 120, 128], [243, 103, 127]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #6E798C, #B39490, #CE8288, #DE7880, #F3677F 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: #6e798c; --color-2: #b39490; --color-3: #ce8288; --color-4: #de7880; --color-5: #f3677f. 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