← Back to Editor

#89789C · #C59DA5 · #9C965A · #C07D84 · #F2EACB

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

#89789C

Deep Indigo · LightSlateGray · Violet

HEX
#89789C
RGB
rgb(137, 120, 156)
HSL
hsl(268, 15%, 54%)
HSB
hsb(268, 23%, 61%)
CMYK
cmyk(12%, 23%, 0%, 39%)
Oklch
oklch(60.1% 0.057 306.2)

TraditionalDeep Indigo」· PaintViolet」· Creative Blush Sunrise

#C59DA5

Peach Pink · DarkGray · Coral Red

HEX
#C59DA5
RGB
rgb(197, 157, 165)
HSL
hsl(348, 26%, 69%)
HSB
hsb(348, 20%, 77%)
CMYK
cmyk(0%, 20%, 16%, 23%)
Oklch
oklch(73.5% 0.049 4.9)

TraditionalPeach Pink」· PaintCoral Red」· Creative Rose Petal

#9C965A

Autumn Sage · Gray · Honey Gold

HEX
#9C965A
RGB
rgb(156, 150, 90)
HSL
hsl(55, 27%, 48%)
HSB
hsb(55, 42%, 61%)
CMYK
cmyk(0%, 4%, 42%, 39%)
Oklch
oklch(66.4% 0.081 103.4)

TraditionalAutumn Sage」· PaintHoney Gold」· Creative Blush Sunrise

#C07D84

Peach Pink · LightCoral · Coral Red

HEX
#C07D84
RGB
rgb(192, 125, 132)
HSL
hsl(354, 35%, 62%)
HSB
hsb(354, 35%, 75%)
CMYK
cmyk(0%, 35%, 31%, 25%)
Oklch
oklch(66.1% 0.084 12.8)

TraditionalPeach Pink」· PaintCoral Red」· Creative Rose Petal

#F2EACB

Goose Yellow · Bisque · Lemon Cream

HEX
#F2EACB
RGB
rgb(242, 234, 203)
HSL
hsl(48, 60%, 87%)
HSB
hsb(48, 16%, 95%)
CMYK
cmyk(0%, 3%, 16%, 5%)
Oklch
oklch(93.5% 0.042 95.1)

TraditionalGoose Yellow」· PaintLemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

89789C
8B9B78

Analogous

78799B
89789C
9A789B

Triadic

89789C
9B8978
789B89

Split-Comp.

89789C
9B9A78
799B78

Tetradic

89789C
9B7879
8B9B78
789B9A

Contrast Matrix WCAG 2.1 Contrast

89789C
C59DA5
9C965A
C07D84
F2EACB
1.7
Fail
1.3
Fail
1.2
Fail
3.3
AA Large
1.7
Fail
1.3
Fail
1.3
Fail
2.0
Fail
1.3
Fail
1.3
Fail
1.1
Fail
2.5
Fail
1.2
Fail
1.3
Fail
1.1
Fail
2.7
Fail
3.3
AA Large
2.0
Fail
2.5
Fail
2.7
Fail
White BG
4.0AA Large
2.4Fail
3.0AA Large
3.2AA Large
1.2Fail
Black BG
5.2AA
8.7AAA
6.9AA
6.5AA
17.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

828193
B4B3A3
999969
A3A282
EFEED3

Deuteranopia

838491
B6B9A3
9A9A6C
A7AC82
EFF0D4

Tritanopia

888C8B
C3A2A1
9C7477
BD8181
F2D8DA

Achromatopsia

818181
AAAAAA
919191
929292
E9E9E9

Shades & Tints Shades & Tints

#89789C

Dark
Light

#C59DA5

Dark
Light

#9C965A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #89789c;
  --color-2: #c59da5;
  --color-3: #9c965a;
  --color-4: #c07d84;
  --color-5: #f2eacb;
}

SCSS

$color-1: #89789c;
$color-2: #c59da5;
$color-3: #9c965a;
$color-4: #c07d84;
$color-5: #f2eacb;

TAILWIND

colors: {
  'brand-1': '#89789c',
  'brand-2': '#c59da5',
  'brand-3': '#9c965a',
  'brand-4': '#c07d84',
  'brand-5': '#f2eacb',
}

RGB Array

[137, 120, 156], [197, 157, 165], [156, 150, 90], [192, 125, 132], [242, 234, 203]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #89789C, #C59DA5, #9C965A, #C07D84, #F2EACB 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: #89789c; --color-2: #c59da5; --color-3: #9c965a; --color-4: #c07d84; --color-5: #f2eacb. 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