← Back to Editor

#68564C · #CD8342 · #D5A539 · #FFFDDF · #C0A59E

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 LibraryData Visualization

Color Details Color Details

#68564C

Tangerine · DimGray · Amber Brown

HEX
#68564C
RGB
rgb(104, 86, 76)
HSL
hsl(21, 16%, 35%)
HSB
hsb(21, 27%, 41%)
CMYK
cmyk(0%, 17%, 27%, 59%)
Oklch
oklch(46.8% 0.029 50.7)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#CD8342

Tangerine · Chocolate · Warm Sun

HEX
#CD8342
RGB
rgb(205, 131, 66)
HSL
hsl(28, 58%, 53%)
HSB
hsb(28, 68%, 80%)
CMYK
cmyk(0%, 36%, 68%, 20%)
Oklch
oklch(67.5% 0.122 59.6)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#D5A539

Ginger · GoldenRod · Sunflower

HEX
#D5A539
RGB
rgb(213, 165, 57)
HSL
hsl(42, 65%, 53%)
HSB
hsb(42, 73%, 84%)
CMYK
cmyk(0%, 23%, 73%, 16%)
Oklch
oklch(74.8% 0.133 83.8)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#FFFDDF

Fresh Green · LightYellow · Lemon Cream

HEX
#FFFDDF
RGB
rgb(255, 253, 223)
HSL
hsl(56, 100%, 94%)
HSB
hsb(56, 13%, 100%)
CMYK
cmyk(0%, 1%, 13%, 0%)
Oklch
oklch(98.8% 0.039 104.0)

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

#C0A59E

Peach Pink · DarkGray · Coral Red

HEX
#C0A59E
RGB
rgb(192, 165, 158)
HSL
hsl(12, 21%, 69%)
HSB
hsb(12, 18%, 75%)
CMYK
cmyk(0%, 14%, 18%, 25%)
Oklch
oklch(74.4% 0.033 34.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

68564C
4B5E68

Analogous

684B4F
68564C
68634B

Triadic

68564C
4B6855
554B68

Split-Comp.

68564C
4B6863
4B4F68

Tetradic

68564C
4F684B
4B5E68
634B68

Contrast Matrix WCAG 2.1 Contrast

68564C
CD8342
D5A539
FFFDDF
C0A59E
—
2.3
Fail
3.1
AA Large
6.7
AA
3.0
AA Large
2.3
Fail
—
1.3
Fail
2.9
Fail
1.3
Fail
3.1
AA Large
1.3
Fail
—
2.2
Fail
1.0
Fail
6.7
AA
2.9
Fail
2.2
Fail
—
2.2
Fail
3.0
AA Large
1.3
Fail
1.0
Fail
2.2
Fail
—
White BG
6.9AA
3.0AA Large
2.3Fail
1.0Fail
2.3Fail
Black BG
3.0AA Large
6.9AA
9.3AAA
20.4AAA
9.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

60604E
ADAC52
C0C053
FEFEE6
B4B4A0

Deuteranopia

61634F
B1B756
C3C759
FEFEE8
B6B8A0

Tritanopia

675051
C95E61
D3686C
FFECED
BFA1A1

Achromatopsia

5A5A5A
929292
A7A7A7
FAFAFA
ACACAC

Shades & Tints Shades & Tints

#68564C

Dark
Light

#CD8342

Dark
Light

#D5A539

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #68564c;
  --color-2: #cd8342;
  --color-3: #d5a539;
  --color-4: #fffddf;
  --color-5: #c0a59e;
}

SCSS

$color-1: #68564c;
$color-2: #cd8342;
$color-3: #d5a539;
$color-4: #fffddf;
$color-5: #c0a59e;

TAILWIND

colors: {
  'brand-1': '#68564c',
  'brand-2': '#cd8342',
  'brand-3': '#d5a539',
  'brand-4': '#fffddf',
  'brand-5': '#c0a59e',
}

RGB Array

[104, 86, 76], [205, 131, 66], [213, 165, 57], [255, 253, 223], [192, 165, 158]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #68564C, #CD8342, #D5A539, #FFFDDF, #C0A59E is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #68564c; --color-2: #cd8342; --color-3: #d5a539; --color-4: #fffddf; --color-5: #c0a59e. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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