← Back to Editor

#C4C29C · #CAA97E · #BC8461 · #6B364A · #312346

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

Color Details Color Details

#C4C29C

Fresh Green · Tan · Sunflower

HEX
#C4C29C
RGB
rgb(196, 194, 156)
HSL
hsl(57, 25%, 69%)
HSB
hsb(57, 20%, 77%)
CMYK
cmyk(0%, 1%, 20%, 23%)
Oklch
oklch(80.6% 0.051 105.0)

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

#CAA97E

Ginger · Tan · Warm Sun

HEX
#CAA97E
RGB
rgb(202, 169, 126)
HSL
hsl(34, 42%, 64%)
HSB
hsb(34, 38%, 79%)
CMYK
cmyk(0%, 16%, 38%, 21%)
Oklch
oklch(75.4% 0.069 73.8)

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

#BC8461

Tangerine · DarkSalmon · Warm Sun

HEX
#BC8461
RGB
rgb(188, 132, 97)
HSL
hsl(23, 40%, 56%)
HSB
hsb(23, 48%, 74%)
CMYK
cmyk(0%, 30%, 48%, 26%)
Oklch
oklch(66.1% 0.085 52.7)

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

#6B364A

Dark Violet · DimGray · Camellia

HEX
#6B364A
RGB
rgb(107, 54, 74)
HSL
hsl(337, 33%, 32%)
HSB
hsb(337, 50%, 42%)
CMYK
cmyk(0%, 50%, 31%, 58%)
Oklch
oklch(40.7% 0.079 357.2)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#312346

Deep Indigo · DarkSlateGray · Eggplant

HEX
#312346
RGB
rgb(49, 35, 70)
HSL
hsl(264, 33%, 21%)
HSB
hsb(264, 50%, 27%)
CMYK
cmyk(30%, 50%, 0%, 73%)
Oklch
oklch(29.1% 0.064 301.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C4C29C
9C9EC4

Analogous

C4AE9C
C4C29C
B2C49C

Triadic

C4C29C
9CC4C2
C29CC4

Split-Comp.

C4C29C
9CB2C4
AE9CC4

Tetradic

C4C29C
9CC4AE
9C9EC4
C49CB2

Contrast Matrix WCAG 2.1 Contrast

C4C29C
CAA97E
BC8461
6B364A
312346
—
1.2
Fail
1.7
Fail
5.1
AA
7.9
AAA
1.2
Fail
—
1.4
Fail
4.2
AA Large
6.5
AA
1.7
Fail
1.4
Fail
—
2.9
Fail
4.5
AA
5.1
AA
4.2
AA Large
2.9
Fail
—
1.5
Fail
7.9
AAA
6.5
AA
4.5
AA
1.5
Fail
—
White BG
1.8Fail
2.2Fail
3.2AA Large
9.3AAA
14.4AAA
Black BG
11.5AAA
9.5AAA
6.6AA
2.3Fail
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

C3C3A5
BCBB88
A4A369
545445
2B2B3E

Deuteranopia

C3C3A7
BEC08B
A7AB6C
575B44
2C2D3C

Tritanopia

C4ACAE
C89192
B97072
684141
303735

Achromatopsia

BEBEBE
AEAEAE
919191
484848
2B2B2B

Shades & Tints Shades & Tints

#C4C29C

Dark
Light

#CAA97E

Dark
Light

#BC8461

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c4c29c;
  --color-2: #caa97e;
  --color-3: #bc8461;
  --color-4: #6b364a;
  --color-5: #312346;
}

SCSS

$color-1: #c4c29c;
$color-2: #caa97e;
$color-3: #bc8461;
$color-4: #6b364a;
$color-5: #312346;

TAILWIND

colors: {
  'brand-1': '#c4c29c',
  'brand-2': '#caa97e',
  'brand-3': '#bc8461',
  'brand-4': '#6b364a',
  'brand-5': '#312346',
}

RGB Array

[196, 194, 156], [202, 169, 126], [188, 132, 97], [107, 54, 74], [49, 35, 70]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C4C29C, #CAA97E, #BC8461, #6B364A, #312346 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: #c4c29c; --color-2: #caa97e; --color-3: #bc8461; --color-4: #6b364a; --color-5: #312346. 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