← Back to Editor

#FFE983 · #FFE04A · #B5B533 · #F45E07 · #2C1A1A

bright

A 5-color bright 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

#FFE983

Goose Yellow · Khaki · Lemon Cream

HEX
#FFE983
RGB
rgb(255, 233, 131)
HSL
hsl(49, 100%, 76%)
HSB
hsb(49, 49%, 100%)
CMYK
cmyk(0%, 9%, 49%, 0%)
Oklch
oklch(93.1% 0.125 97.5)

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

#FFE04A

Fresh Green · SandyBrown · Sunflower

HEX
#FFE04A
RGB
rgb(255, 224, 74)
HSL
hsl(50, 100%, 65%)
HSB
hsb(50, 71%, 100%)
CMYK
cmyk(0%, 12%, 71%, 0%)
Oklch
oklch(90.7% 0.164 97.2)

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

#B5B533

Autumn Sage · GoldenRod · Honey Gold

HEX
#B5B533
RGB
rgb(181, 181, 51)
HSL
hsl(60, 56%, 45%)
HSB
hsb(60, 72%, 71%)
CMYK
cmyk(0%, 0%, 72%, 29%)
Oklch
oklch(75.0% 0.146 109.5)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#F45E07

Tangerine · OrangeRed · Amber Brown

HEX
#F45E07
RGB
rgb(244, 94, 7)
HSL
hsl(22, 94%, 49%)
HSB
hsb(22, 97%, 96%)
CMYK
cmyk(0%, 61%, 97%, 4%)
Oklch
oklch(66.9% 0.200 42.1)

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

#2C1A1A

Crimson · Black · Deep Berry

HEX
#2C1A1A
RGB
rgb(44, 26, 26)
HSL
hsl(0, 26%, 14%)
HSB
hsb(0, 41%, 17%)
CMYK
cmyk(0%, 41%, 41%, 83%)
Oklch
oklch(24.1% 0.029 19.4)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFE983
859BFF

Analogous

FFAB85
FFE983
D8FF85

Triadic

FFE983
85FFE9
E985FF

Split-Comp.

FFE983
85D8FF
AB85FF

Tetradic

FFE983
85FFAB
859BFF
FF85D8

Contrast Matrix WCAG 2.1 Contrast

FFE983
FFE04A
B5B533
F45E07
2C1A1A
—
1.1
Fail
1.8
Fail
2.7
Fail
13.6
AAA
1.1
Fail
—
1.7
Fail
2.5
Fail
12.6
AAA
1.8
Fail
1.7
Fail
—
1.5
Fail
7.6
AAA
2.7
Fail
2.5
Fail
1.5
Fail
—
5.1
AA
13.6
AAA
12.6
AAA
7.6
AAA
5.1
AA
—
White BG
1.2Fail
1.3Fail
2.2Fail
3.3AA Large
16.5AAA
Black BG
17.2AAA
16.0AAA
9.6AAA
6.5AA
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

F5F59C
F2F16E
B5B552
B3B21C
24241A

Deuteranopia

F7F8A2
F3F677
B5B55A
BCC721
25271A

Tritanopia

FEAFB3
FD8B91
B56B71
EC2D30
2B1A1A

Achromatopsia

E4E4E4
D8D8D8
A6A6A6
818181
1F1F1F

Shades & Tints Shades & Tints

#FFE983

Dark
Light

#FFE04A

Dark
Light

#B5B533

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffe983;
  --color-2: #ffe04a;
  --color-3: #b5b533;
  --color-4: #f45e07;
  --color-5: #2c1a1a;
}

SCSS

$color-1: #ffe983;
$color-2: #ffe04a;
$color-3: #b5b533;
$color-4: #f45e07;
$color-5: #2c1a1a;

TAILWIND

colors: {
  'brand-1': '#ffe983',
  'brand-2': '#ffe04a',
  'brand-3': '#b5b533',
  'brand-4': '#f45e07',
  'brand-5': '#2c1a1a',
}

RGB Array

[255, 233, 131], [255, 224, 74], [181, 181, 51], [244, 94, 7], [44, 26, 26]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #FFE983, #FFE04A, #B5B533, #F45E07, #2C1A1A is ideal for: social media posters, mobile apps, e-commerce promos, 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: #ffe983; --color-2: #ffe04a; --color-3: #b5b533; --color-4: #f45e07; --color-5: #2c1a1a. 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 bright-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