← Back to Editor

#D0A968 · #AFA783 · #969880 · #92876B · #423B31

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#D0A968

Ginger · DarkSalmon · Warm Sun

HEX
#D0A968
RGB
rgb(208, 169, 104)
HSL
hsl(38, 53%, 61%)
HSB
hsb(38, 50%, 82%)
CMYK
cmyk(0%, 19%, 50%, 18%)
Oklch
oklch(75.6% 0.095 79.3)

TraditionalGinger」· PaintWarm Sun」· Creative Honey Glow

#AFA783

Ginger · Tan · Sunflower

HEX
#AFA783
RGB
rgb(175, 167, 131)
HSL
hsl(49, 22%, 60%)
HSB
hsb(49, 25%, 69%)
CMYK
cmyk(0%, 5%, 25%, 31%)
Oklch
oklch(72.6% 0.050 97.0)

TraditionalGinger」· PaintSunflower」· Creative Blush Sunrise

#969880

Autumn Sage · Gray · Sunflower

HEX
#969880
RGB
rgb(150, 152, 128)
HSL
hsl(65, 10%, 55%)
HSB
hsb(65, 16%, 60%)
CMYK
cmyk(1%, 0%, 16%, 40%)
Oklch
oklch(67.1% 0.034 111.2)

TraditionalAutumn Sage」· PaintSunflower」· Creative Blush Sunrise

#92876B

Ochre · Gray · Honey Gold

HEX
#92876B
RGB
rgb(146, 135, 107)
HSL
hsl(43, 15%, 50%)
HSB
hsb(43, 27%, 57%)
CMYK
cmyk(0%, 8%, 27%, 43%)
Oklch
oklch(62.6% 0.042 89.1)

TraditionalOchre」· PaintHoney Gold」· Creative Blush Sunrise

#423B31

Ochre · DarkSlateGray · Cinnamon

HEX
#423B31
RGB
rgb(66, 59, 49)
HSL
hsl(35, 15%, 23%)
HSB
hsb(35, 26%, 26%)
CMYK
cmyk(0%, 11%, 26%, 74%)
Oklch
oklch(35.6% 0.019 76.8)

TraditionalOchre」· PaintCinnamon」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D0A968
678DD0

Analogous

D07567
D0A968
C2D067

Triadic

D0A968
67D0AA
AA67D0

Split-Comp.

D0A968
67C2D0
7567D0

Tetradic

D0A968
67D075
678DD0
D067C2

Contrast Matrix WCAG 2.1 Contrast

D0A968
AFA783
969880
92876B
423B31
1.1
Fail
1.3
Fail
1.6
Fail
5.0
AA
1.1
Fail
1.2
Fail
1.5
Fail
4.6
AA
1.3
Fail
1.2
Fail
1.2
Fail
3.7
AA Large
1.6
Fail
1.5
Fail
1.2
Fail
3.1
AA Large
5.0
AA
4.6
AA
3.7
AA Large
3.1
AA Large
White BG
2.2Fail
2.4Fail
3.0Fail
3.6AA Large
11.0AAA
Black BG
9.6AAA
8.7AAA
7.1AAA
5.9AA
1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

BFBF78
ACAB8C
979786
8D8D72
3F3F33

Deuteranopia

C1C47C
ACAD8E
979787
8E8F73
3F4034

Tritanopia

CE8487
AF9394
968A8B
917778
423536

Achromatopsia

ADADAD
A5A5A5
959595
878787
3C3C3C

Shades & Tints Shades & Tints

#D0A968

Dark
Light

#AFA783

Dark
Light

#969880

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d0a968;
  --color-2: #afa783;
  --color-3: #969880;
  --color-4: #92876b;
  --color-5: #423b31;
}

SCSS

$color-1: #d0a968;
$color-2: #afa783;
$color-3: #969880;
$color-4: #92876b;
$color-5: #423b31;

TAILWIND

colors: {
  'brand-1': '#d0a968',
  'brand-2': '#afa783',
  'brand-3': '#969880',
  'brand-4': '#92876b',
  'brand-5': '#423b31',
}

RGB Array

[208, 169, 104], [175, 167, 131], [150, 152, 128], [146, 135, 107], [66, 59, 49]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D0A968, #AFA783, #969880, #92876B, #423B31 is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #d0a968; --color-2: #afa783; --color-3: #969880; --color-4: #92876b; --color-5: #423b31. 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. Restrained colors convey professionalism and trust. 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