← Back to Editor

#FFDA6C · #B59536 · #780C3B · #5C1138 · #3B172A

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

Color Details Color Details

#FFDA6C

Goose Yellow · Khaki · Sunflower

HEX
#FFDA6C
RGB
rgb(255, 218, 108)
HSL
hsl(45, 100%, 71%)
HSB
hsb(45, 58%, 100%)
CMYK
cmyk(0%, 15%, 58%, 0%)
Oklch
oklch(89.9% 0.135 90.9)

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

#B59536

Ochre · DarkGoldenRod · Honey Gold

HEX
#B59536
RGB
rgb(181, 149, 54)
HSL
hsl(45, 54%, 46%)
HSB
hsb(45, 70%, 71%)
CMYK
cmyk(0%, 18%, 70%, 29%)
Oklch
oklch(68.2% 0.118 90.0)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#780C3B

Dark Violet · Brown · Camellia

HEX
#780C3B
RGB
rgb(120, 12, 59)
HSL
hsl(334, 82%, 26%)
HSB
hsb(334, 90%, 47%)
CMYK
cmyk(0%, 90%, 51%, 53%)
Oklch
oklch(37.6% 0.142 2.3)

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

#5C1138

Rose Purple · Maroon · Raspberry

HEX
#5C1138
RGB
rgb(92, 17, 56)
HSL
hsl(329, 69%, 21%)
HSB
hsb(329, 82%, 36%)
CMYK
cmyk(0%, 82%, 39%, 64%)
Oklch
oklch(32.4% 0.113 353.8)

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

#3B172A

Rose Purple · DarkSlateGray · Raspberry

HEX
#3B172A
RGB
rgb(59, 23, 42)
HSL
hsl(328, 44%, 16%)
HSB
hsb(328, 61%, 23%)
CMYK
cmyk(0%, 61%, 29%, 77%)
Oklch
oklch(26.6% 0.063 349.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFDA6C
6B90FF

Analogous

FF906B
FFDA6C
DAFF6B

Triadic

FFDA6C
6BFFDA
DA6BFF

Split-Comp.

FFDA6C
6BDAFF
906BFF

Tetradic

FFDA6C
6BFF90
6B90FF
FF6BDA

Contrast Matrix WCAG 2.1 Contrast

FFDA6C
B59536
780C3B
5C1138
3B172A
—
2.1
Fail
8.1
AAA
9.7
AAA
11.5
AAA
2.1
Fail
—
3.8
AA Large
4.6
AA
5.5
AA
8.1
AAA
3.8
AA Large
—
1.2
Fail
1.4
Fail
9.7
AAA
4.6
AA
1.2
Fail
—
1.2
Fail
11.5
AAA
5.5
AA
1.4
Fail
1.2
Fail
—
White BG
1.4Fail
2.9Fail
11.0AAA
13.2AAA
15.6AAA
Black BG
15.5AAA
7.3AAA
1.9Fail
1.6Fail
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

EFEF87
A7A74D
494830
3C3B2F
2B2B25

Deuteranopia

F1F48D
A9AB53
50582D
40452C
2E3024

Tritanopia

FD9CA0
B35F63
732725
582725
392221

Achromatopsia

D9D9D9
949494
323232
2C2C2C
242424

Shades & Tints Shades & Tints

#FFDA6C

Dark
Light

#B59536

Dark
Light

#780C3B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffda6c;
  --color-2: #b59536;
  --color-3: #780c3b;
  --color-4: #5c1138;
  --color-5: #3b172a;
}

SCSS

$color-1: #ffda6c;
$color-2: #b59536;
$color-3: #780c3b;
$color-4: #5c1138;
$color-5: #3b172a;

TAILWIND

colors: {
  'brand-1': '#ffda6c',
  'brand-2': '#b59536',
  'brand-3': '#780c3b',
  'brand-4': '#5c1138',
  'brand-5': '#3b172a',
}

RGB Array

[255, 218, 108], [181, 149, 54], [120, 12, 59], [92, 17, 56], [59, 23, 42]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFDA6C, #B59536, #780C3B, #5C1138, #3B172A is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #ffda6c; --color-2: #b59536; --color-3: #780c3b; --color-4: #5c1138; --color-5: #3b172a. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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 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