← Back to Editor

#C1BA95 · #E7AF67 · #F7B731 · #463645 · #E9104A

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

#C1BA95

Fresh Green · Tan · Sunflower

HEX
#C1BA95
RGB
rgb(193, 186, 149)
HSL
hsl(50, 26%, 67%)
HSB
hsb(50, 23%, 76%)
CMYK
cmyk(0%, 4%, 23%, 24%)
Oklch
oklch(78.5% 0.051 98.5)

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

#E7AF67

Ginger · SandyBrown · Warm Sun

HEX
#E7AF67
RGB
rgb(231, 175, 103)
HSL
hsl(34, 73%, 65%)
HSB
hsb(34, 55%, 91%)
CMYK
cmyk(0%, 24%, 55%, 9%)
Oklch
oklch(79.1% 0.111 72.0)

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

#F7B731

Ginger · GoldenRod · Sunflower

HEX
#F7B731
RGB
rgb(247, 183, 49)
HSL
hsl(41, 93%, 58%)
HSB
hsb(41, 80%, 97%)
CMYK
cmyk(0%, 26%, 80%, 3%)
Oklch
oklch(81.8% 0.156 80.7)

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

#463645

Rose Purple · DarkSlateGray · Eggplant

HEX
#463645
RGB
rgb(70, 54, 69)
HSL
hsl(304, 13%, 24%)
HSB
hsb(304, 23%, 27%)
CMYK
cmyk(0%, 23%, 1%, 73%)
Oklch
oklch(35.6% 0.033 328.3)

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

#E9104A

Dark Violet · Crimson · Camellia

HEX
#E9104A
RGB
rgb(233, 16, 74)
HSL
hsl(344, 87%, 49%)
HSB
hsb(344, 93%, 91%)
CMYK
cmyk(0%, 93%, 68%, 9%)
Oklch
oklch(59.6% 0.234 16.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C1BA95
959CC1

Analogous

C1A495
C1BA95
B2C195

Triadic

C1BA95
95C1B9
B995C1

Split-Comp.

C1BA95
95B2C1
A495C1

Tetradic

C1BA95
95C1A4
959CC1
C195B2

Contrast Matrix WCAG 2.1 Contrast

C1BA95
E7AF67
F7B731
463645
E9104A
—
1.0
Fail
1.1
Fail
5.7
AA
2.3
Fail
1.0
Fail
—
1.1
Fail
5.7
AA
2.3
Fail
1.1
Fail
1.1
Fail
—
6.3
AA
2.5
Fail
5.7
AA
5.7
AA
6.3
AA
—
2.5
Fail
2.3
Fail
2.3
Fail
2.5
Fail
2.5
Fail
—
White BG
2.0Fail
2.0Fail
1.8Fail
11.2AAA
4.5AA
Black BG
10.7AAA
10.7AAA
11.8AAA
1.9Fail
4.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BEBE9E
CFCE78
DBDB51
3F3F41
8B893C

Deuteranopia

BEBFA0
D2D67D
DFE459
404141
98A839

Tritanopia

C1A5A7
E48689
F46B71
453F3E
DE312E

Achromatopsia

B8B8B8
B8B8B8
BBBBBB
3C3C3C
575757

Shades & Tints Shades & Tints

#C1BA95

Dark
Light

#E7AF67

Dark
Light

#F7B731

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c1ba95;
  --color-2: #e7af67;
  --color-3: #f7b731;
  --color-4: #463645;
  --color-5: #e9104a;
}

SCSS

$color-1: #c1ba95;
$color-2: #e7af67;
$color-3: #f7b731;
$color-4: #463645;
$color-5: #e9104a;

TAILWIND

colors: {
  'brand-1': '#c1ba95',
  'brand-2': '#e7af67',
  'brand-3': '#f7b731',
  'brand-4': '#463645',
  'brand-5': '#e9104a',
}

RGB Array

[193, 186, 149], [231, 175, 103], [247, 183, 49], [70, 54, 69], [233, 16, 74]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C1BA95, #E7AF67, #F7B731, #463645, #E9104A 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: #c1ba95; --color-2: #e7af67; --color-3: #f7b731; --color-4: #463645; --color-5: #e9104a. 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