← Back to Editor

#F6596E · #D20D65 · #7E4A67 · #BEA1A6 · #BBAEA6

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#F6596E

Peach Pink · Salmon · Coral Red

HEX
#F6596E
RGB
rgb(246, 89, 110)
HSL
hsl(352, 90%, 66%)
HSB
hsb(352, 64%, 96%)
CMYK
cmyk(0%, 64%, 55%, 4%)
Oklch
oklch(67.7% 0.192 16.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#D20D65

Dark Violet · MediumVioletRed · Camellia

HEX
#D20D65
RGB
rgb(210, 13, 101)
HSL
hsl(333, 88%, 44%)
HSB
hsb(333, 94%, 82%)
CMYK
cmyk(0%, 94%, 52%, 18%)
Oklch
oklch(55.9% 0.220 4.1)

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

#7E4A67

Rose Purple · DimGray · Camellia

HEX
#7E4A67
RGB
rgb(126, 74, 103)
HSL
hsl(327, 26%, 39%)
HSB
hsb(327, 41%, 49%)
CMYK
cmyk(0%, 41%, 18%, 51%)
Oklch
oklch(47.9% 0.081 346.0)

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

#BEA1A6

Peach Pink · DarkGray · Coral Red

HEX
#BEA1A6
RGB
rgb(190, 161, 166)
HSL
hsl(350, 18%, 69%)
HSB
hsb(350, 15%, 75%)
CMYK
cmyk(0%, 15%, 13%, 25%)
Oklch
oklch(73.6% 0.035 6.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#BBAEA6

Apricot · DarkGray · Warm Sun

HEX
#BBAEA6
RGB
rgb(187, 174, 166)
HSL
hsl(23, 13%, 69%)
HSB
hsb(23, 11%, 73%)
CMYK
cmyk(0%, 7%, 11%, 27%)
Oklch
oklch(75.9% 0.019 53.9)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F6596E
5AF6E2

Analogous

F65ABD
F6596E
F6935A

Triadic

F6596E
6FF65A
5A6FF6

Split-Comp.

F6596E
5AF693
5ABDF6

Tetradic

F6596E
BDF65A
5AF6E2
935AF6

Contrast Matrix WCAG 2.1 Contrast

F6596E
D20D65
7E4A67
BEA1A6
BBAEA6
—
1.6
Fail
2.1
Fail
1.3
Fail
1.5
Fail
1.6
Fail
—
1.3
Fail
2.2
Fail
2.4
Fail
2.1
Fail
1.3
Fail
—
2.9
Fail
3.2
AA Large
1.3
Fail
2.2
Fail
2.9
Fail
—
1.1
Fail
1.5
Fail
2.4
Fail
3.2
AA Large
1.1
Fail
—
White BG
3.2AA Large
5.3AA
6.9AA
2.4Fail
2.2Fail
Black BG
6.6AA
4.0AA Large
3.1AA Large
8.8AAA
9.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B2B169
7D7B50
676760
B1B1A5
B5B5A8

Deuteranopia

BBC768
88974B
6B6E5E
B3B5A5
B6B7A8

Tritanopia

EE6564
C83F3B
7B5A59
BDA4A4
BAA9AA

Achromatopsia

8A8A8A
525252
5D5D5D
AAAAAA
B1B1B1

Shades & Tints Shades & Tints

#F6596E

Dark
Light

#D20D65

Dark
Light

#7E4A67

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f6596e;
  --color-2: #d20d65;
  --color-3: #7e4a67;
  --color-4: #bea1a6;
  --color-5: #bbaea6;
}

SCSS

$color-1: #f6596e;
$color-2: #d20d65;
$color-3: #7e4a67;
$color-4: #bea1a6;
$color-5: #bbaea6;

TAILWIND

colors: {
  'brand-1': '#f6596e',
  'brand-2': '#d20d65',
  'brand-3': '#7e4a67',
  'brand-4': '#bea1a6',
  'brand-5': '#bbaea6',
}

RGB Array

[246, 89, 110], [210, 13, 101], [126, 74, 103], [190, 161, 166], [187, 174, 166]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F6596E, #D20D65, #7E4A67, #BEA1A6, #BBAEA6 is ideal for: corporate websites, product showcases, portfolios. 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: #f6596e; --color-2: #d20d65; --color-3: #7e4a67; --color-4: #bea1a6; --color-5: #bbaea6. 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 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