← Back to Editor

#CDB471 · #8A6A39 · #AEB379 · #FFCF70 · #F3BA69

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#CDB471

Ginger · Tan · Sunflower

HEX
#CDB471
RGB
rgb(205, 180, 113)
HSL
hsl(44, 48%, 62%)
HSB
hsb(44, 45%, 80%)
CMYK
cmyk(0%, 12%, 45%, 20%)
Oklch
oklch(77.7% 0.091 89.7)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#8A6A39

Ochre · Sienna · Amber Brown

HEX
#8A6A39
RGB
rgb(138, 106, 57)
HSL
hsl(36, 42%, 38%)
HSB
hsb(36, 59%, 54%)
CMYK
cmyk(0%, 23%, 59%, 46%)
Oklch
oklch(54.5% 0.078 76.6)

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

#AEB379

Autumn Sage · DarkSeaGreen · Sunflower

HEX
#AEB379
RGB
rgb(174, 179, 121)
HSL
hsl(65, 28%, 59%)
HSB
hsb(65, 32%, 70%)
CMYK
cmyk(3%, 0%, 32%, 30%)
Oklch
oklch(74.9% 0.078 112.3)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#FFCF70

Goose Yellow · Khaki · Sunflower

HEX
#FFCF70
RGB
rgb(255, 207, 112)
HSL
hsl(40, 100%, 72%)
HSB
hsb(40, 56%, 100%)
CMYK
cmyk(0%, 19%, 56%, 0%)
Oklch
oklch(87.8% 0.125 82.9)

Traditional「Goose Yellow」· Paint「Sunflower」· Creative Lemon Fizz

#F3BA69

Ginger · SandyBrown · Warm Sun

HEX
#F3BA69
RGB
rgb(243, 186, 105)
HSL
hsl(35, 85%, 68%)
HSB
hsb(35, 57%, 95%)
CMYK
cmyk(0%, 23%, 57%, 5%)
Oklch
oklch(82.5% 0.119 74.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CDB471
7088CD

Analogous

CD8570
CDB471
B7CD70

Triadic

CDB471
70CDB4
B470CD

Split-Comp.

CDB471
70B7CD
8570CD

Tetradic

CDB471
70CD85
7088CD
CD70B7

Contrast Matrix WCAG 2.1 Contrast

CDB471
8A6A39
AEB379
FFCF70
F3BA69
—
2.5
Fail
1.1
Fail
1.4
Fail
1.2
Fail
2.5
Fail
—
2.3
Fail
3.4
AA Large
2.9
Fail
1.1
Fail
2.3
Fail
—
1.5
Fail
1.3
Fail
1.4
Fail
3.4
AA Large
1.5
Fail
—
1.2
Fail
1.2
Fail
2.9
Fail
1.3
Fail
1.2
Fail
—
White BG
2.0Fail
5.0AA
2.2Fail
1.5Fail
1.7Fail
Black BG
10.4AAA
4.2AA Large
9.5AAA
14.4AAA
12.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C2C281
7C7C45
B0B087
EAEA87
DADA7D

Deuteranopia

C4C685
7E8048
B0B08A
EDF18D
DEE281

Tritanopia

CC8E91
884E50
AE9295
FD999D
F08C8F

Achromatopsia

B4B4B4
6E6E6E
ABABAB
D3D3D3
C2C2C2

Shades & Tints Shades & Tints

#CDB471

Dark
Light

#8A6A39

Dark
Light

#AEB379

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cdb471;
  --color-2: #8a6a39;
  --color-3: #aeb379;
  --color-4: #ffcf70;
  --color-5: #f3ba69;
}

SCSS

$color-1: #cdb471;
$color-2: #8a6a39;
$color-3: #aeb379;
$color-4: #ffcf70;
$color-5: #f3ba69;

TAILWIND

colors: {
  'brand-1': '#cdb471',
  'brand-2': '#8a6a39',
  'brand-3': '#aeb379',
  'brand-4': '#ffcf70',
  'brand-5': '#f3ba69',
}

RGB Array

[205, 180, 113], [138, 106, 57], [174, 179, 121], [255, 207, 112], [243, 186, 105]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CDB471, #8A6A39, #AEB379, #FFCF70, #F3BA69 is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #cdb471; --color-2: #8a6a39; --color-3: #aeb379; --color-4: #ffcf70; --color-5: #f3ba69. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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