← Back to Editor

#F63C61 · #432F34 · #D6D92B · #FFAA9B · #FDB8A8

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

#F63C61

Vermilion · Tomato · Passion Red

HEX
#F63C61
RGB
rgb(246, 60, 97)
HSL
hsl(348, 91%, 60%)
HSB
hsb(348, 76%, 96%)
CMYK
cmyk(0%, 76%, 61%, 4%)
Oklch
oklch(64.7% 0.220 15.2)

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

#432F34

Crimson · DarkSlateGray · Wine Red

HEX
#432F34
RGB
rgb(67, 47, 52)
HSL
hsl(345, 18%, 22%)
HSB
hsb(345, 30%, 26%)
CMYK
cmyk(0%, 30%, 22%, 74%)
Oklch
oklch(33.0% 0.030 2.4)

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

#D6D92B

Autumn Sage · GoldenRod · Sunflower

HEX
#D6D92B
RGB
rgb(214, 217, 43)
HSL
hsl(61, 70%, 51%)
HSB
hsb(61, 80%, 85%)
CMYK
cmyk(1%, 0%, 80%, 15%)
Oklch
oklch(85.6% 0.178 110.7)

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

#FFAA9B

Peach Pink · LightSalmon · Coral Red

HEX
#FFAA9B
RGB
rgb(255, 170, 155)
HSL
hsl(9, 100%, 80%)
HSB
hsb(9, 39%, 100%)
CMYK
cmyk(0%, 33%, 39%, 0%)
Oklch
oklch(81.7% 0.103 30.4)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#FDB8A8

Peach Pink · LightPink · Cherry Blossom

HEX
#FDB8A8
RGB
rgb(253, 184, 168)
HSL
hsl(11, 96%, 83%)
HSB
hsb(11, 34%, 99%)
CMYK
cmyk(0%, 27%, 34%, 1%)
Oklch
oklch(84.3% 0.084 33.5)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F63C61
3CF6D1

Analogous

F63CBE
F63C61
F6743C

Triadic

F63C61
61F63C
3C61F6

Split-Comp.

F63C61
3CF674
3CBEF6

Tetradic

F63C61
BEF63C
3CF6D1
743CF6

Contrast Matrix WCAG 2.1 Contrast

F63C61
432F34
D6D92B
FFAA9B
FDB8A8
—
3.4
AA Large
2.4
Fail
2.0
Fail
2.2
Fail
3.4
AA Large
—
8.2
AAA
6.8
AA
7.4
AAA
2.4
Fail
8.2
AAA
—
1.2
Fail
1.1
Fail
2.0
Fail
6.8
AA
1.2
Fail
—
1.1
Fail
2.2
Fail
7.4
AAA
1.1
Fail
1.1
Fail
—
White BG
3.7AA Large
12.4AAA
1.5Fail
1.8Fail
1.7Fail
Black BG
5.7AA
1.7Fail
13.8AAA
11.5AAA
12.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A5A458
3A3A33
D7D755
DAD99F
DFDFAC

Deuteranopia

B0BE56
3C3D33
D7D75F
DFE6A0
E3E8AD

Tritanopia

ED514F
423232
D6767E
FBA1A2
FAAFB0

Achromatopsia

787878
363636
C4C4C4
C2C2C2
CBCBCB

Shades & Tints Shades & Tints

#F63C61

Dark
Light

#432F34

Dark
Light

#D6D92B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f63c61;
  --color-2: #432f34;
  --color-3: #d6d92b;
  --color-4: #ffaa9b;
  --color-5: #fdb8a8;
}

SCSS

$color-1: #f63c61;
$color-2: #432f34;
$color-3: #d6d92b;
$color-4: #ffaa9b;
$color-5: #fdb8a8;

TAILWIND

colors: {
  'brand-1': '#f63c61',
  'brand-2': '#432f34',
  'brand-3': '#d6d92b',
  'brand-4': '#ffaa9b',
  'brand-5': '#fdb8a8',
}

RGB Array

[246, 60, 97], [67, 47, 52], [214, 217, 43], [255, 170, 155], [253, 184, 168]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F63C61, #432F34, #D6D92B, #FFAA9B, #FDB8A8 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: #f63c61; --color-2: #432f34; --color-3: #d6d92b; --color-4: #ffaa9b; --color-5: #fdb8a8. 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