#8A7B9A + #D18088 + #DEA772 + #DBC86A + #DCDD9F · warm - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#8A7B9A

Deep Indigo · LightSlateGray · Violet

HEX

#8A7B9A

RGB

rgb(138, 123, 154)

HSL

hsl(269, 13%, 54%)

HSB

hsb(269, 20%, 60%)

CMYK

cmyk(10%, 20%, 0%, 40%)

Oklch

oklch(60.7% 0.049 306.9)

Traditional「Deep Indigo」· Paint「Violet」· Creative Blush Sunrise

#D18088

Peach Pink · LightCoral · Coral Red

HEX

#D18088

RGB

rgb(209, 128, 136)

HSL

hsl(354, 47%, 66%)

HSB

hsb(354, 39%, 82%)

CMYK

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

Oklch

oklch(68.8% 0.101 13.7)

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

#DEA772

Apricot · DarkSalmon · Warm Sun

HEX

#DEA772

RGB

rgb(222, 167, 114)

HSL

hsl(29, 62%, 66%)

HSB

hsb(29, 49%, 87%)

CMYK

cmyk(0%, 25%, 49%, 13%)

Oklch

oklch(76.8% 0.095 64.6)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#DBC86A

Fresh Green · BurlyWood · Sunflower

HEX

#DBC86A

RGB

rgb(219, 200, 106)

HSL

hsl(50, 61%, 64%)

HSB

hsb(50, 52%, 86%)

CMYK

cmyk(0%, 9%, 52%, 14%)

Oklch

oklch(82.9% 0.117 98.1)

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

#DCDD9F

Fresh Green · Khaki · Sunflower

HEX

#DCDD9F

RGB

rgb(220, 221, 159)

HSL

hsl(61, 48%, 75%)

HSB

hsb(61, 28%, 87%)

CMYK

cmyk(0%, 0%, 28%, 13%)

Oklch

oklch(88.2% 0.080 108.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8A7B9A

8A997A

Analogous

7A7B99

8A7B9A

987A99

Triadic

8A7B9A

99897A

7A9989

Split-Comp.

8A7B9A

99987A

7B997A

Tetradic

8A7B9A

997A7B

8A997A

7A9998

Contrast Matrix WCAG 2.1 Contrast

8A7B9A	D18088	DEA772	DBC86A	DCDD9F
—	1.3 Fail	1.8 Fail	2.3 Fail	2.8 Fail
1.3 Fail	—	1.4 Fail	1.7 Fail	2.1 Fail
1.8 Fail	1.4 Fail	—	1.3 Fail	1.5 Fail
2.3 Fail	1.7 Fail	1.3 Fail	—	1.2 Fail
2.8 Fail	2.1 Fail	1.5 Fail	1.2 Fail	—

White BG

3.9AA Large

2.9Fail

2.1Fail

1.7Fail

1.4Fail

Black BG

5.4AA

7.2AAA

9.9AAA

12.5AAA

14.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

848392

AEAD86

C6C67F

D3D381

DCDCAE

Deuteranopia

848691

B3B986

C9CD82

D4D586

DCDCB2

Tritanopia

898D8B

CD8584

DB898B

DA9397

DCBABC

Achromatopsia

838383

999999

B1B1B1

C3C3C3

D6D6D6

Shades & Tints Shades & Tints

#8A7B9A

Dark

Light

#D18088

Dark

Light

#DEA772

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8a7b9a;
  --color-2: #d18088;
  --color-3: #dea772;
  --color-4: #dbc86a;
  --color-5: #dcdd9f;
}

SCSS

$color-1: #8a7b9a;
$color-2: #d18088;
$color-3: #dea772;
$color-4: #dbc86a;
$color-5: #dcdd9f;

TAILWIND

colors: {
  'brand-1': '#8a7b9a',
  'brand-2': '#d18088',
  'brand-3': '#dea772',
  'brand-4': '#dbc86a',
  'brand-5': '#dcdd9f',
}

RGB Array

[138, 123, 154], [209, 128, 136], [222, 167, 114], [219, 200, 106], [220, 221, 159]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #8A7B9A, #D18088, #DEA772, #DBC86A, #DCDD9F 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: #8a7b9a; --color-2: #d18088; --color-3: #dea772; --color-4: #dbc86a; --color-5: #dcdd9f. 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 warm-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