← Back to Editor

#F6D93D · #CCB066 · #D29264 · #E76A4A · #DA341A

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

#F6D93D

Autumn Sage · Gold · Sunflower

HEX
#F6D93D
RGB
rgb(246, 217, 61)
HSL
hsl(51, 91%, 60%)
HSB
hsb(51, 75%, 96%)
CMYK
cmyk(0%, 12%, 75%, 4%)
Oklch
oklch(88.4% 0.166 98.1)

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

#CCB066

Ginger · BurlyWood · Sunflower

HEX
#CCB066
RGB
rgb(204, 176, 102)
HSL
hsl(44, 50%, 60%)
HSB
hsb(44, 50%, 80%)
CMYK
cmyk(0%, 14%, 50%, 20%)
Oklch
oklch(76.6% 0.099 89.3)

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

#D29264

Apricot · DarkSalmon · Warm Sun

HEX
#D29264
RGB
rgb(210, 146, 100)
HSL
hsl(25, 55%, 61%)
HSB
hsb(25, 52%, 82%)
CMYK
cmyk(0%, 30%, 52%, 18%)
Oklch
oklch(71.3% 0.099 56.1)

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

#E76A4A

Vermilion · Tomato · Passion Red

HEX
#E76A4A
RGB
rgb(231, 106, 74)
HSL
hsl(12, 77%, 60%)
HSB
hsb(12, 68%, 91%)
CMYK
cmyk(0%, 54%, 68%, 9%)
Oklch
oklch(67.0% 0.163 35.5)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#DA341A

Vermilion · FireBrick · Passion Red

HEX
#DA341A
RGB
rgb(218, 52, 26)
HSL
hsl(8, 79%, 48%)
HSB
hsb(8, 88%, 85%)
CMYK
cmyk(0%, 76%, 88%, 15%)
Oklch
oklch(58.3% 0.206 31.7)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F6D93D
3C58F6

Analogous

F67D3C
F6D93D
B5F63C

Triadic

F6D93D
3CF6DA
DA3CF6

Split-Comp.

F6D93D
3CB5F6
7D3CF6

Tetradic

F6D93D
3CF67D
3C58F6
F63CB5

Contrast Matrix WCAG 2.1 Contrast

F6D93D
CCB066
D29264
E76A4A
DA341A
—
1.5
Fail
1.9
Fail
2.3
Fail
3.3
AA Large
1.5
Fail
—
1.2
Fail
1.5
Fail
2.2
Fail
1.9
Fail
1.2
Fail
—
1.2
Fail
1.8
Fail
2.3
Fail
1.5
Fail
1.2
Fail
—
1.5
Fail
3.3
AA Large
2.2
Fail
1.8
Fail
1.5
Fail
—
White BG
1.4Fail
2.1Fail
2.6Fail
3.2AA Large
4.7AA
Black BG
14.9AAA
10.0AAA
8.0AAA
6.6AA
4.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

E9E963
C0C078
B6B66F
B1B052
929120

Deuteranopia

EBED6C
C2C47C
BABF72
B8C254
9CA822

Tritanopia

F58187
CB8689
CF787A
E15859
D22526

Achromatopsia

D0D0D0
B0B0B0
A0A0A0
8C8C8C
636363

Shades & Tints Shades & Tints

#F6D93D

Dark
Light

#CCB066

Dark
Light

#D29264

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f6d93d;
  --color-2: #ccb066;
  --color-3: #d29264;
  --color-4: #e76a4a;
  --color-5: #da341a;
}

SCSS

$color-1: #f6d93d;
$color-2: #ccb066;
$color-3: #d29264;
$color-4: #e76a4a;
$color-5: #da341a;

TAILWIND

colors: {
  'brand-1': '#f6d93d',
  'brand-2': '#ccb066',
  'brand-3': '#d29264',
  'brand-4': '#e76a4a',
  'brand-5': '#da341a',
}

RGB Array

[246, 217, 61], [204, 176, 102], [210, 146, 100], [231, 106, 74], [218, 52, 26]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F6D93D, #CCB066, #D29264, #E76A4A, #DA341A 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: #f6d93d; --color-2: #ccb066; --color-3: #d29264; --color-4: #e76a4a; --color-5: #da341a. 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