#625686 + #9D6877 + #E1716C + #D3F95B + #DFA5A6 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#625686

Deep Indigo · DimGray · Navy Blue

HEX

#625686

RGB

rgb(98, 86, 134)

HSL

hsl(255, 22%, 43%)

HSB

hsb(255, 36%, 53%)

CMYK

cmyk(27%, 36%, 0%, 47%)

Oklch

oklch(48.5% 0.077 294.9)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#9D6877

Dark Violet · Gray · Rose Pink

HEX

#9D6877

RGB

rgb(157, 104, 119)

HSL

hsl(343, 21%, 51%)

HSB

hsb(343, 34%, 62%)

CMYK

cmyk(0%, 34%, 24%, 38%)

Oklch

oklch(57.8% 0.071 1.1)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#E1716C

Peach Pink · LightCoral · Coral Red

HEX

#E1716C

RGB

rgb(225, 113, 108)

HSL

hsl(3, 66%, 65%)

HSB

hsb(3, 52%, 88%)

CMYK

cmyk(0%, 50%, 52%, 12%)

Oklch

oklch(67.8% 0.141 24.1)

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

#D3F95B

Willow Green · GreenYellow · Apple Green

HEX

#D3F95B

RGB

rgb(211, 249, 91)

HSL

hsl(74, 93%, 67%)

HSB

hsb(74, 63%, 98%)

CMYK

cmyk(15%, 0%, 63%, 2%)

Oklch

oklch(92.6% 0.185 121.7)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#DFA5A6

Peach Pink · Tan · Coral Red

HEX

#DFA5A6

RGB

rgb(223, 165, 166)

HSL

hsl(359, 48%, 76%)

HSB

hsb(359, 26%, 87%)

CMYK

cmyk(0%, 26%, 26%, 13%)

Oklch

oklch(77.7% 0.069 17.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

625686

7A8656

Analogous

566286

625686

7A5686

Triadic

625686

866256

568662

Split-Comp.

625686

867A56

628656

Tetradic

625686

865662

7A8656

56867A

Contrast Matrix WCAG 2.1 Contrast

625686	9D6877	E1716C	D3F95B	DFA5A6
—	1.5 Fail	2.1 Fail	5.5 AA	3.2 AA Large
1.5 Fail	—	1.4 Fail	3.7 AA Large	2.2 Fail
2.1 Fail	1.4 Fail	—	2.6 Fail	1.5 Fail
5.5 AA	3.7 AA Large	2.6 Fail	—	1.7 Fail
3.2 AA Large	2.2 Fail	1.5 Fail	1.7 Fail	—

White BG

6.6AA

4.5AA Large

3.1AA Large

1.2Fail

2.1Fail

Black BG

3.2AA Large

4.7AA

6.8AA

17.5AAA

10.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5D5D7A

868673

B1AF6D

E3E481

C6C5A6

Deuteranopia

5E5E78

898D73

B7BF6E

E1DE8A

C9CEA6

Tritanopia

61716F

9A7170

DB6E6E

D59FA6

DCA6A6

Achromatopsia

5F5F5F

7A7A7A

929292

DCDCDC

B6B6B6

Shades & Tints Shades & Tints

#625686

Dark

Light

#9D6877

Dark

Light

#E1716C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #625686;
  --color-2: #9d6877;
  --color-3: #e1716c;
  --color-4: #d3f95b;
  --color-5: #dfa5a6;
}

SCSS

$color-1: #625686;
$color-2: #9d6877;
$color-3: #e1716c;
$color-4: #d3f95b;
$color-5: #dfa5a6;

TAILWIND

colors: {
  'brand-1': '#625686',
  'brand-2': '#9d6877',
  'brand-3': '#e1716c',
  'brand-4': '#d3f95b',
  'brand-5': '#dfa5a6',
}

RGB Array

[98, 86, 134], [157, 104, 119], [225, 113, 108], [211, 249, 91], [223, 165, 166]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #625686, #9D6877, #E1716C, #D3F95B, #DFA5A6 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: #625686; --color-2: #9d6877; --color-3: #e1716c; --color-4: #d3f95b; --color-5: #dfa5a6. 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