← Back to Editor

#24121C · #FC2968 · #F9EA59 · #DCDC19 · #B9DF7B

cool

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

#24121C

Rose Purple · Black · Raspberry

HEX
#24121C
RGB
rgb(36, 18, 28)
HSL
hsl(327, 33%, 11%)
HSB
hsb(327, 50%, 14%)
CMYK
cmyk(0%, 50%, 22%, 86%)
Oklch
oklch(21.2% 0.034 346.0)

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

#FC2968

Dark Violet · DeepPink · Rose Pink

HEX
#FC2968
RGB
rgb(252, 41, 104)
HSL
hsl(342, 97%, 57%)
HSB
hsb(342, 84%, 99%)
CMYK
cmyk(0%, 84%, 59%, 1%)
Oklch
oklch(64.6% 0.239 11.4)

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

#F9EA59

Fresh Green · Khaki · Sunflower

HEX
#F9EA59
RGB
rgb(249, 234, 89)
HSL
hsl(54, 93%, 66%)
HSB
hsb(54, 64%, 98%)
CMYK
cmyk(0%, 6%, 64%, 2%)
Oklch
oklch(92.3% 0.162 103.4)

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

#DCDC19

Autumn Sage · Gold · Honey Gold

HEX
#DCDC19
RGB
rgb(220, 220, 25)
HSL
hsl(60, 80%, 48%)
HSB
hsb(60, 89%, 86%)
CMYK
cmyk(0%, 0%, 89%, 14%)
Oklch
oklch(86.6% 0.185 109.7)

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

#B9DF7B

Willow Green · LightGreen · Apple Green

HEX
#B9DF7B
RGB
rgb(185, 223, 123)
HSL
hsl(83, 61%, 68%)
HSB
hsb(83, 45%, 87%)
CMYK
cmyk(17%, 0%, 45%, 13%)
Oklch
oklch(85.4% 0.134 126.1)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

24121C
13251B

Analogous

241325
24121C
251314

Triadic

24121C
1D2513
131D25

Split-Comp.

24121C
142513
132524

Tetradic

24121C
252413
13251B
131425

Contrast Matrix WCAG 2.1 Contrast

24121C
FC2968
F9EA59
DCDC19
B9DF7B
—
4.8
AA
14.4
AAA
12.1
AAA
11.8
AAA
4.8
AA
—
3.0
Fail
2.5
Fail
2.5
Fail
14.4
AAA
3.0
Fail
—
1.2
Fail
1.2
Fail
12.1
AAA
2.5
Fail
1.2
Fail
—
1.0
Fail
11.8
AAA
2.5
Fail
1.2
Fail
1.0
Fail
—
White BG
17.8AAA
3.7AA Large
1.2Fail
1.5Fail
1.5Fail
Black BG
1.2Fail
5.7AA
16.9AAA
14.3AAA
13.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

1C1C1A
A19F59
F3F27C
DCDC48
C9CA93

Deuteranopia

1D1F19
ADBD55
F3F585
DCDC54
C7C499

Tritanopia

231817
F14D4A
F8989E
DC6D76
BBA6AB

Achromatopsia

191919
6F6F6F
DEDEDE
C6C6C6
C8C8C8

Shades & Tints Shades & Tints

#24121C

Dark
Light

#FC2968

Dark
Light

#F9EA59

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #24121c;
  --color-2: #fc2968;
  --color-3: #f9ea59;
  --color-4: #dcdc19;
  --color-5: #b9df7b;
}

SCSS

$color-1: #24121c;
$color-2: #fc2968;
$color-3: #f9ea59;
$color-4: #dcdc19;
$color-5: #b9df7b;

TAILWIND

colors: {
  'brand-1': '#24121c',
  'brand-2': '#fc2968',
  'brand-3': '#f9ea59',
  'brand-4': '#dcdc19',
  'brand-5': '#b9df7b',
}

RGB Array

[36, 18, 28], [252, 41, 104], [249, 234, 89], [220, 220, 25], [185, 223, 123]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #24121C, #FC2968, #F9EA59, #DCDC19, #B9DF7B 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: #24121c; --color-2: #fc2968; --color-3: #f9ea59; --color-4: #dcdc19; --color-5: #b9df7b. 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 cool-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