← Back to Editor

#CBE91B · #F17D17 · #F31B33 · #F11883 · #DF9FFC

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

#CBE91B

Autumn Sage · GreenYellow · Sunflower

HEX
#CBE91B
RGB
rgb(203, 233, 27)
HSL
hsl(69, 82%, 51%)
HSB
hsb(69, 88%, 91%)
CMYK
cmyk(13%, 0%, 88%, 9%)
Oklch
oklch(88.1% 0.202 118.8)

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

#F17D17

Tangerine · Chocolate · Warm Sun

HEX
#F17D17
RGB
rgb(241, 125, 23)
HSL
hsl(28, 89%, 52%)
HSB
hsb(28, 90%, 95%)
CMYK
cmyk(0%, 48%, 90%, 5%)
Oklch
oklch(70.9% 0.173 53.5)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#F31B33

Vermilion · Crimson · Passion Red

HEX
#F31B33
RGB
rgb(243, 27, 51)
HSL
hsl(353, 90%, 53%)
HSB
hsb(353, 89%, 95%)
CMYK
cmyk(0%, 89%, 79%, 5%)
Oklch
oklch(61.5% 0.239 24.2)

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

#F11883

Dark Violet · DeepPink · Rose Pink

HEX
#F11883
RGB
rgb(241, 24, 131)
HSL
hsl(330, 89%, 52%)
HSB
hsb(330, 90%, 95%)
CMYK
cmyk(0%, 90%, 46%, 5%)
Oklch
oklch(62.7% 0.246 359.7)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#DF9FFC

Lilac · Violet · Lavender

HEX
#DF9FFC
RGB
rgb(223, 159, 252)
HSL
hsl(281, 94%, 81%)
HSB
hsb(281, 37%, 99%)
CMYK
cmyk(12%, 37%, 0%, 1%)
Oklch
oklch(79.6% 0.144 314.8)

Traditional「Lilac」· Paint「Lavender」· Creative Lavender Dream

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CBE91B
3A1CE9

Analogous

E9A11C
CBE91B
63E91C

Triadic

CBE91B
1CCAE9
E91CCA

Split-Comp.

CBE91B
1C63E9
A11CE9

Tetradic

CBE91B
1CE9A1
3A1CE9
E91C63

Contrast Matrix WCAG 2.1 Contrast

CBE91B
F17D17
F31B33
F11883
DF9FFC
—
2.0
Fail
3.0
AA Large
2.9
Fail
1.4
Fail
2.0
Fail
—
1.5
Fail
1.5
Fail
1.4
Fail
3.0
AA Large
1.5
Fail
—
1.0
Fail
2.1
Fail
2.9
Fail
1.5
Fail
1.0
Fail
—
2.0
Fail
1.4
Fail
1.4
Fail
2.1
Fail
2.0
Fail
—
White BG
1.4Fail
2.7Fail
4.2AA Large
4.0AA Large
2.0Fail
Black BG
15.2AAA
7.7AAA
5.0AA
5.2AA
10.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D8D84D
BFBE30
95942D
939169
C3C3E5

Deuteranopia

D6D459
C6CE36
A2B22C
A0B063
C7CCE0

Tritanopia

CD747D
EB4347
E82928
E65550
DCD4D0

Achromatopsia

C9C9C9
949494
5E5E5E
656565
BDBDBD

Shades & Tints Shades & Tints

#CBE91B

Dark
Light

#F17D17

Dark
Light

#F31B33

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cbe91b;
  --color-2: #f17d17;
  --color-3: #f31b33;
  --color-4: #f11883;
  --color-5: #df9ffc;
}

SCSS

$color-1: #cbe91b;
$color-2: #f17d17;
$color-3: #f31b33;
$color-4: #f11883;
$color-5: #df9ffc;

TAILWIND

colors: {
  'brand-1': '#cbe91b',
  'brand-2': '#f17d17',
  'brand-3': '#f31b33',
  'brand-4': '#f11883',
  'brand-5': '#df9ffc',
}

RGB Array

[203, 233, 27], [241, 125, 23], [243, 27, 51], [241, 24, 131], [223, 159, 252]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CBE91B, #F17D17, #F31B33, #F11883, #DF9FFC 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: #cbe91b; --color-2: #f17d17; --color-3: #f31b33; --color-4: #f11883; --color-5: #df9ffc. 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