← Back to Editor

#F64B99 · #F2E6C9 · #8D9ED5 · #475A91 · #132057

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#F64B99

Rouge · DeepPink · Rose Pink

HEX
#F64B99
RGB
rgb(246, 75, 153)
HSL
hsl(333, 90%, 63%)
HSB
hsb(333, 70%, 96%)
CMYK
cmyk(0%, 70%, 38%, 4%)
Oklch
oklch(67.4% 0.216 356.7)

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

#F2E6C9

Goose Yellow · Bisque · Lemon Cream

HEX
#F2E6C9
RGB
rgb(242, 230, 201)
HSL
hsl(42, 61%, 87%)
HSB
hsb(42, 17%, 95%)
CMYK
cmyk(0%, 5%, 17%, 5%)
Oklch
oklch(92.7% 0.040 88.2)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#8D9ED5

Azure · CornflowerBlue · Cobalt Blue

HEX
#8D9ED5
RGB
rgb(141, 158, 213)
HSL
hsl(226, 46%, 69%)
HSB
hsb(226, 34%, 84%)
CMYK
cmyk(34%, 26%, 0%, 16%)
Oklch
oklch(70.7% 0.083 270.9)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#475A91

Indigo · DarkSlateBlue · Navy Blue

HEX
#475A91
RGB
rgb(71, 90, 145)
HSL
hsl(225, 34%, 42%)
HSB
hsb(225, 51%, 57%)
CMYK
cmyk(51%, 38%, 0%, 43%)
Oklch
oklch(47.8% 0.092 268.4)

Traditional「Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#132057

Indigo · MidnightBlue · Prussian Blue

HEX
#132057
RGB
rgb(19, 32, 87)
HSL
hsl(229, 64%, 21%)
HSB
hsb(229, 78%, 34%)
CMYK
cmyk(78%, 63%, 0%, 66%)
Oklch
oklch(27.1% 0.101 268.6)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F64B99
4CF6A9

Analogous

F64CED
F64B99
F6544C

Triadic

F64B99
98F64C
4C98F6

Split-Comp.

F64B99
4CF654
4CEDF6

Tetradic

F64B99
EDF64C
4CF6A9
544CF6

Contrast Matrix WCAG 2.1 Contrast

F64B99
F2E6C9
8D9ED5
475A91
132057
—
2.7
Fail
1.3
Fail
2.0
Fail
4.7
AA
2.7
Fail
—
2.1
Fail
5.4
AA
12.3
AAA
1.3
Fail
2.1
Fail
—
2.5
Fail
5.8
AA
2.0
Fail
5.4
AA
2.5
Fail
—
2.3
Fail
4.7
AA
12.3
AAA
5.8
AA
2.3
Fail
—
White BG
3.3AA Large
1.2Fail
2.6Fail
6.7AA
15.3AAA
Black BG
6.4AA
16.9AAA
8.0AAA
3.1AA Large
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

ACAA86
EDEDD0
9495C8
4F4F84
19194A

Deuteranopia

B6C382
EEEED2
9392C5
4E4D81
181747

Tritanopia

ED7774
F1D6D7
8EBDBB
487977
143F3D

Achromatopsia

878787
E6E6E6
9F9F9F
5B5B5B
222222

Shades & Tints Shades & Tints

#F64B99

Dark
Light

#F2E6C9

Dark
Light

#8D9ED5

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f64b99;
  --color-2: #f2e6c9;
  --color-3: #8d9ed5;
  --color-4: #475a91;
  --color-5: #132057;
}

SCSS

$color-1: #f64b99;
$color-2: #f2e6c9;
$color-3: #8d9ed5;
$color-4: #475a91;
$color-5: #132057;

TAILWIND

colors: {
  'brand-1': '#f64b99',
  'brand-2': '#f2e6c9',
  'brand-3': '#8d9ed5',
  'brand-4': '#475a91',
  'brand-5': '#132057',
}

RGB Array

[246, 75, 153], [242, 230, 201], [141, 158, 213], [71, 90, 145], [19, 32, 87]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F64B99, #F2E6C9, #8D9ED5, #475A91, #132057 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #f64b99; --color-2: #f2e6c9; --color-3: #8d9ed5; --color-4: #475a91; --color-5: #132057. 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 tech, SaaS, healthcare, eco industries. 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