← Back to Editor

#F6F5E0 · #84756B · #C42266 · #FC2793 · #FF5D8F

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

#F6F5E0

Fresh Green · Beige · Lemon Cream

HEX
#F6F5E0
RGB
rgb(246, 245, 224)
HSL
hsl(57, 55%, 92%)
HSB
hsb(57, 9%, 96%)
CMYK
cmyk(0%, 0%, 9%, 4%)
Oklch
oklch(96.5% 0.028 104.7)

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

#84756B

Tangerine · Gray · Amber Brown

HEX
#84756B
RGB
rgb(132, 117, 107)
HSL
hsl(24, 10%, 47%)
HSB
hsb(24, 19%, 52%)
CMYK
cmyk(0%, 11%, 19%, 48%)
Oklch
oklch(57.3% 0.024 55.9)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#C42266

Dark Violet · MediumVioletRed · Camellia

HEX
#C42266
RGB
rgb(196, 34, 102)
HSL
hsl(335, 70%, 45%)
HSB
hsb(335, 83%, 77%)
CMYK
cmyk(0%, 83%, 48%, 23%)
Oklch
oklch(54.3% 0.199 2.3)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#FC2793

Dark Violet · DeepPink · Rose Pink

HEX
#FC2793
RGB
rgb(252, 39, 147)
HSL
hsl(330, 97%, 57%)
HSB
hsb(330, 85%, 99%)
CMYK
cmyk(0%, 85%, 42%, 1%)
Oklch
oklch(65.7% 0.250 357.1)

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

#FF5D8F

Rouge · LightCoral · Rose Pink

HEX
#FF5D8F
RGB
rgb(255, 93, 143)
HSL
hsl(341, 100%, 68%)
HSB
hsb(341, 64%, 100%)
CMYK
cmyk(0%, 64%, 44%, 0%)
Oklch
oklch(70.3% 0.200 4.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F6F5E0
DFE1F6

Analogous

F6E9DF
F6F5E0
ECF6DF

Triadic

F6F5E0
DFF6F5
F5DFF6

Split-Comp.

F6F5E0
DFECF6
E9DFF6

Tetradic

F6F5E0
DFF6E9
DFE1F6
F6DFEC

Contrast Matrix WCAG 2.1 Contrast

F6F5E0
84756B
C42266
FC2793
FF5D8F
—
4.0
AA Large
5.1
AA
3.3
AA Large
2.6
Fail
4.0
AA Large
—
1.3
Fail
1.2
Fail
1.5
Fail
5.1
AA
1.3
Fail
—
1.6
Fail
1.9
Fail
3.3
AA Large
1.2
Fail
1.6
Fail
—
1.2
Fail
2.6
Fail
1.5
Fail
1.9
Fail
1.2
Fail
—
White BG
1.1Fail
4.4AA Large
5.6AA
3.6AA Large
2.9Fail
Black BG
19.1AAA
4.7AA
3.8AA Large
5.9AA
7.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F6F6E5
7E7D6D
7E7C56
A09E79
B9B783

Deuteranopia

F6F6E6
7E806E
879352
ACBC73
C2CE80

Tritanopia

F6E9EA
836F70
BC4946
F16460
F77977

Achromatopsia

F3F3F3
787878
5A5A5A
737373
939393

Shades & Tints Shades & Tints

#F6F5E0

Dark
Light

#84756B

Dark
Light

#C42266

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f6f5e0;
  --color-2: #84756b;
  --color-3: #c42266;
  --color-4: #fc2793;
  --color-5: #ff5d8f;
}

SCSS

$color-1: #f6f5e0;
$color-2: #84756b;
$color-3: #c42266;
$color-4: #fc2793;
$color-5: #ff5d8f;

TAILWIND

colors: {
  'brand-1': '#f6f5e0',
  'brand-2': '#84756b',
  'brand-3': '#c42266',
  'brand-4': '#fc2793',
  'brand-5': '#ff5d8f',
}

RGB Array

[246, 245, 224], [132, 117, 107], [196, 34, 102], [252, 39, 147], [255, 93, 143]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F6F5E0, #84756B, #C42266, #FC2793, #FF5D8F 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: #f6f5e0; --color-2: #84756b; --color-3: #c42266; --color-4: #fc2793; --color-5: #ff5d8f. 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