← Back to Editor

#CF6C8F · #C74848 · #EA6F39 · #FFBC1F · #F2F048

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

#CF6C8F

Rouge · LightCoral · Rose Pink

HEX
#CF6C8F
RGB
rgb(207, 108, 143)
HSL
hsl(339, 51%, 62%)
HSB
hsb(339, 48%, 81%)
CMYK
cmyk(0%, 48%, 31%, 19%)
Oklch
oklch(65.5% 0.130 358.9)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#C74848

Crimson · Sienna · Passion Red

HEX
#C74848
RGB
rgb(199, 72, 72)
HSL
hsl(0, 53%, 53%)
HSB
hsb(0, 64%, 78%)
CMYK
cmyk(0%, 64%, 64%, 22%)
Oklch
oklch(57.6% 0.162 23.7)

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

#EA6F39

Tangerine · Tomato · Warm Sun

HEX
#EA6F39
RGB
rgb(234, 111, 57)
HSL
hsl(18, 81%, 57%)
HSB
hsb(18, 76%, 92%)
CMYK
cmyk(0%, 53%, 76%, 8%)
Oklch
oklch(68.0% 0.167 42.5)

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

#FFBC1F

Ginger · Orange · Sunflower

HEX
#FFBC1F
RGB
rgb(255, 188, 31)
HSL
hsl(42, 100%, 56%)
HSB
hsb(42, 88%, 100%)
CMYK
cmyk(0%, 26%, 88%, 0%)
Oklch
oklch(83.5% 0.167 81.6)

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

#F2F048

Fresh Green · Khaki · Sunflower

HEX
#F2F048
RGB
rgb(242, 240, 72)
HSL
hsl(59, 87%, 62%)
HSB
hsb(59, 70%, 95%)
CMYK
cmyk(0%, 1%, 70%, 5%)
Oklch
oklch(92.9% 0.179 108.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CF6C8F
6DD0AD

Analogous

D06DC1
CF6C8F
D07C6D

Triadic

CF6C8F
8FD06D
6D8FD0

Split-Comp.

CF6C8F
6DD07C
6DC1D0

Tetradic

CF6C8F
C1D06D
6DD0AD
7C6DD0

Contrast Matrix WCAG 2.1 Contrast

CF6C8F
C74848
EA6F39
FFBC1F
F2F048
—
1.4
Fail
1.1
Fail
2.0
Fail
2.8
Fail
1.4
Fail
—
1.5
Fail
2.8
Fail
3.9
AA Large
1.1
Fail
1.5
Fail
—
1.8
Fail
2.5
Fail
2.0
Fail
2.8
Fail
1.8
Fail
—
1.4
Fail
2.8
Fail
3.9
AA Large
2.5
Fail
1.4
Fail
—
White BG
3.4AA Large
4.7AA
3.1AA Large
1.7Fail
1.2Fail
Black BG
6.2AA
4.4AA Large
6.8AA
12.5AAA
17.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A4A387
908F48
B5B446
E2E145
F1F171

Deuteranopia

AAB185
97A148
BCC549
E6EB4E
F1F17A

Tritanopia

CA807E
C14848
E45053
FC636A
F29198

Achromatopsia

8E8E8E
6E6E6E
8E8E8E
BEBEBE
DDDDDD

Shades & Tints Shades & Tints

#CF6C8F

Dark
Light

#C74848

Dark
Light

#EA6F39

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cf6c8f;
  --color-2: #c74848;
  --color-3: #ea6f39;
  --color-4: #ffbc1f;
  --color-5: #f2f048;
}

SCSS

$color-1: #cf6c8f;
$color-2: #c74848;
$color-3: #ea6f39;
$color-4: #ffbc1f;
$color-5: #f2f048;

TAILWIND

colors: {
  'brand-1': '#cf6c8f',
  'brand-2': '#c74848',
  'brand-3': '#ea6f39',
  'brand-4': '#ffbc1f',
  'brand-5': '#f2f048',
}

RGB Array

[207, 108, 143], [199, 72, 72], [234, 111, 57], [255, 188, 31], [242, 240, 72]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CF6C8F, #C74848, #EA6F39, #FFBC1F, #F2F048 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: #cf6c8f; --color-2: #c74848; --color-3: #ea6f39; --color-4: #ffbc1f; --color-5: #f2f048. 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