← Back to Editor

#F6F4C2 · #FB7AAE · #FF0099 · #B300CC · #6600FF

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#F6F4C2

Fresh Green · Bisque · Lemon Cream

HEX
#F6F4C2
RGB
rgb(246, 244, 194)
HSL
hsl(58, 74%, 86%)
HSB
hsb(58, 21%, 96%)
CMYK
cmyk(0%, 1%, 21%, 4%)
Oklch
oklch(95.6% 0.065 105.7)

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

#FB7AAE

Rouge · LightCoral · Rose Pink

HEX
#FB7AAE
RGB
rgb(251, 122, 174)
HSL
hsl(336, 94%, 73%)
HSB
hsb(336, 51%, 98%)
CMYK
cmyk(0%, 51%, 31%, 2%)
Oklch
oklch(74.3% 0.166 356.5)

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

#FF0099

Rose Purple · DeepPink · Camellia

HEX
#FF0099
RGB
rgb(255, 0, 153)
HSL
hsl(324, 100%, 50%)
HSB
hsb(324, 100%, 100%)
CMYK
cmyk(0%, 100%, 40%, 0%)
Oklch
oklch(65.3% 0.268 354.7)

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

#B300CC

Royal Purple · DarkViolet · Eggplant

HEX
#B300CC
RGB
rgb(179, 0, 204)
HSL
hsl(293, 100%, 40%)
HSB
hsb(293, 100%, 80%)
CMYK
cmyk(12%, 100%, 0%, 20%)
Oklch
oklch(55.5% 0.264 321.4)

Traditional「Royal Purple」· Paint「Eggplant」· Creative Blush Sunrise

#6600FF

Deep Indigo · DarkViolet · Violet

HEX
#6600FF
RGB
rgb(102, 0, 255)
HSL
hsl(264, 100%, 50%)
HSB
hsb(264, 100%, 100%)
CMYK
cmyk(60%, 100%, 0%, 0%)
Oklch
oklch(50.4% 0.294 285.4)

Traditional「Deep Indigo」· Paint「Violet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F6F4C2
C1C3F6

Analogous

F6DAC1
F6F4C2
DDF6C1

Triadic

F6F4C2
C1F6F4
F4C1F6

Split-Comp.

F6F4C2
C1DDF6
DAC1F6

Tetradic

F6F4C2
C1F6DA
C1C3F6
F6C1DD

Contrast Matrix WCAG 2.1 Contrast

F6F4C2
FB7AAE
FF0099
B300CC
6600FF
—
2.2
Fail
3.3
AA Large
4.9
AA
6.2
AA
2.2
Fail
—
1.5
Fail
2.2
Fail
2.8
Fail
3.3
AA Large
1.5
Fail
—
1.5
Fail
1.9
Fail
4.9
AA
2.2
Fail
1.5
Fail
—
1.3
Fail
6.2
AA
2.8
Fail
1.9
Fail
1.3
Fail
—
White BG
1.1Fail
2.5Fail
3.7AA Large
5.5AA
7.0AA
Black BG
18.6AAA
8.5AAA
5.7AA
3.8AA Large
3.0AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

F5F5CE
C3C2A1
918E74
65649B
3A39C1

Deuteranopia

F5F5D1
CBD49E
9FB36B
707D8F
4047B3

Tritanopia

F6D8DA
F59795
F25750
AA746B
619186

Achromatopsia

EFEFEF
A6A6A6
5E5E5E
4D4D4D
3C3C3C

Shades & Tints Shades & Tints

#F6F4C2

Dark
Light

#FB7AAE

Dark
Light

#FF0099

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f6f4c2;
  --color-2: #fb7aae;
  --color-3: #ff0099;
  --color-4: #b300cc;
  --color-5: #6600ff;
}

SCSS

$color-1: #f6f4c2;
$color-2: #fb7aae;
$color-3: #ff0099;
$color-4: #b300cc;
$color-5: #6600ff;

TAILWIND

colors: {
  'brand-1': '#f6f4c2',
  'brand-2': '#fb7aae',
  'brand-3': '#ff0099',
  'brand-4': '#b300cc',
  'brand-5': '#6600ff',
}

RGB Array

[246, 244, 194], [251, 122, 174], [255, 0, 153], [179, 0, 204], [102, 0, 255]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F6F4C2, #FB7AAE, #FF0099, #B300CC, #6600FF 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: #f6f4c2; --color-2: #fb7aae; --color-3: #ff0099; --color-4: #b300cc; --color-5: #6600ff. 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