← Back to Editor

#D9AFA1 · #D7C19C · #7B8BC6 · #786FA6 · #965279

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

#D9AFA1

Apricot · Tan · Warm Sun

HEX
#D9AFA1
RGB
rgb(217, 175, 161)
HSL
hsl(15, 42%, 74%)
HSB
hsb(15, 26%, 85%)
CMYK
cmyk(0%, 19%, 26%, 15%)
Oklch
oklch(78.8% 0.053 39.2)

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

#D7C19C

Goose Yellow · Tan · Warm Sun

HEX
#D7C19C
RGB
rgb(215, 193, 156)
HSL
hsl(38, 42%, 73%)
HSB
hsb(38, 27%, 84%)
CMYK
cmyk(0%, 10%, 27%, 16%)
Oklch
oklch(82.0% 0.055 80.6)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#7B8BC6

Azure · LightSlateGray · Cobalt Blue

HEX
#7B8BC6
RGB
rgb(123, 139, 198)
HSL
hsl(227, 40%, 63%)
HSB
hsb(227, 38%, 78%)
CMYK
cmyk(38%, 30%, 0%, 22%)
Oklch
oklch(64.8% 0.091 272.0)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#786FA6

Deep Indigo · LightSlateGray · Navy Blue

HEX
#786FA6
RGB
rgb(120, 111, 166)
HSL
hsl(250, 24%, 54%)
HSB
hsb(250, 33%, 65%)
CMYK
cmyk(28%, 33%, 0%, 35%)
Oklch
oklch(57.2% 0.084 291.0)

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

#965279

Rose Purple · Gray · Camellia

HEX
#965279
RGB
rgb(150, 82, 121)
HSL
hsl(326, 29%, 45%)
HSB
hsb(326, 45%, 59%)
CMYK
cmyk(0%, 45%, 19%, 41%)
Oklch
oklch(53.1% 0.103 345.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D9AFA1
A1CBD9

Analogous

D9A1AF
D9AFA1
D9CBA1

Triadic

D9AFA1
A1D9AF
AFA1D9

Split-Comp.

D9AFA1
A1D9CB
A1AFD9

Tetradic

D9AFA1
AFD9A1
A1CBD9
CBA1D9

Contrast Matrix WCAG 2.1 Contrast

D9AFA1
D7C19C
7B8BC6
786FA6
965279
—
1.1
Fail
1.7
Fail
2.3
Fail
2.8
Fail
1.1
Fail
—
1.9
Fail
2.6
Fail
3.2
AA Large
1.7
Fail
1.9
Fail
—
1.4
Fail
1.7
Fail
2.3
Fail
2.6
Fail
1.4
Fail
—
1.2
Fail
2.8
Fail
3.2
AA Large
1.7
Fail
1.2
Fail
—
White BG
2.0Fail
1.8Fail
3.3AA Large
4.5AA
5.6AA
Black BG
10.6AAA
12.0AAA
6.4AA
4.6AA
3.8AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

C7C6A4
CDCDA5
8282B8
747499
797870

Deuteranopia

C9CCA5
CFD0A7
8180B4
757596
7D826D

Tritanopia

D7A7A8
D6ACAE
7CACAA
788E8C
936866

Achromatopsia

BABABA
C3C3C3
8D8D8D
787878
6B6B6B

Shades & Tints Shades & Tints

#D9AFA1

Dark
Light

#D7C19C

Dark
Light

#7B8BC6

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d9afa1;
  --color-2: #d7c19c;
  --color-3: #7b8bc6;
  --color-4: #786fa6;
  --color-5: #965279;
}

SCSS

$color-1: #d9afa1;
$color-2: #d7c19c;
$color-3: #7b8bc6;
$color-4: #786fa6;
$color-5: #965279;

TAILWIND

colors: {
  'brand-1': '#d9afa1',
  'brand-2': '#d7c19c',
  'brand-3': '#7b8bc6',
  'brand-4': '#786fa6',
  'brand-5': '#965279',
}

RGB Array

[217, 175, 161], [215, 193, 156], [123, 139, 198], [120, 111, 166], [150, 82, 121]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D9AFA1, #D7C19C, #7B8BC6, #786FA6, #965279 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: #d9afa1; --color-2: #d7c19c; --color-3: #7b8bc6; --color-4: #786fa6; --color-5: #965279. 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