← Back to Editor

#CBBD33 · #F16540 · #F21D41 · #230F2B · #EBEBBC

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

#CBBD33

Autumn Sage · GoldenRod · Honey Gold

HEX
#CBBD33
RGB
rgb(203, 189, 51)
HSL
hsl(54, 60%, 50%)
HSB
hsb(54, 75%, 80%)
CMYK
cmyk(0%, 7%, 75%, 20%)
Oklch
oklch(78.7% 0.150 103.3)

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

#F16540

Vermilion · Tomato · Passion Red

HEX
#F16540
RGB
rgb(241, 101, 64)
HSL
hsl(13, 86%, 60%)
HSB
hsb(13, 73%, 95%)
CMYK
cmyk(0%, 58%, 73%, 5%)
Oklch
oklch(67.7% 0.181 35.8)

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

#F21D41

Vermilion · Crimson · Passion Red

HEX
#F21D41
RGB
rgb(242, 29, 65)
HSL
hsl(350, 89%, 53%)
HSB
hsb(350, 88%, 95%)
CMYK
cmyk(0%, 88%, 73%, 5%)
Oklch
oklch(61.6% 0.236 21.0)

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

#230F2B

Dark Plum · Black · Dark Purple

HEX
#230F2B
RGB
rgb(35, 15, 43)
HSL
hsl(283, 48%, 11%)
HSB
hsb(283, 65%, 17%)
CMYK
cmyk(19%, 65%, 0%, 83%)
Oklch
oklch(21.3% 0.059 315.5)

Traditional「Dark Plum」· Paint「Dark Purple」· Creative Blush Sunrise

#EBEBBC

Fresh Green · Wheat · Lemon Cream

HEX
#EBEBBC
RGB
rgb(235, 235, 188)
HSL
hsl(60, 54%, 83%)
HSB
hsb(60, 20%, 92%)
CMYK
cmyk(0%, 0%, 20%, 8%)
Oklch
oklch(92.8% 0.061 107.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CBBD33
3342CC

Analogous

CC7033
CBBD33
8FCC33

Triadic

CBBD33
33CCBD
BD33CC

Split-Comp.

CBBD33
338FCC
7033CC

Tetradic

CBBD33
33CC70
3342CC
CC338F

Contrast Matrix WCAG 2.1 Contrast

CBBD33
F16540
F21D41
230F2B
EBEBBC
—
1.6
Fail
2.2
Fail
9.3
AAA
1.6
Fail
1.6
Fail
—
1.3
Fail
5.7
AA
2.6
Fail
2.2
Fail
1.3
Fail
—
4.3
AA Large
3.4
AA Large
9.3
AAA
5.7
AA
4.3
AA Large
—
14.6
AAA
1.6
Fail
2.6
Fail
3.4
AA Large
14.6
AAA
—
White BG
1.9Fail
3.1AA Large
4.2AA Large
17.9AAA
1.2Fail
Black BG
10.9AAA
6.7AA
5.0AA
1.2Fail
17.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C5C554
B4B349
969438
1A1A24
EBEBC7

Deuteranopia

C6C75C
BDC74B
A2B236
1C1D23
EBEBCA

Tritanopia

CA6F75
EA5052
E73130
221F1E
EBD0D2

Achromatopsia

B1B1B1
8B8B8B
616161
181818
E6E6E6

Shades & Tints Shades & Tints

#CBBD33

Dark
Light

#F16540

Dark
Light

#F21D41

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cbbd33;
  --color-2: #f16540;
  --color-3: #f21d41;
  --color-4: #230f2b;
  --color-5: #ebebbc;
}

SCSS

$color-1: #cbbd33;
$color-2: #f16540;
$color-3: #f21d41;
$color-4: #230f2b;
$color-5: #ebebbc;

TAILWIND

colors: {
  'brand-1': '#cbbd33',
  'brand-2': '#f16540',
  'brand-3': '#f21d41',
  'brand-4': '#230f2b',
  'brand-5': '#ebebbc',
}

RGB Array

[203, 189, 51], [241, 101, 64], [242, 29, 65], [35, 15, 43], [235, 235, 188]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CBBD33, #F16540, #F21D41, #230F2B, #EBEBBC 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: #cbbd33; --color-2: #f16540; --color-3: #f21d41; --color-4: #230f2b; --color-5: #ebebbc. 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 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