← Back to Editor

#2F827E · #7D5178 · #F04F82 · #F7824F · #E6E5CF

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

#2F827E

Mineral Blue · SeaGreen · Mint Ice

HEX
#2F827E
RGB
rgb(47, 130, 126)
HSL
hsl(177, 47%, 35%)
HSB
hsb(177, 64%, 51%)
CMYK
cmyk(64%, 0%, 3%, 49%)
Oklch
oklch(55.6% 0.079 190.6)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#7D5178

Rose Purple · DimGray · Eggplant

HEX
#7D5178
RGB
rgb(125, 81, 120)
HSL
hsl(307, 21%, 40%)
HSB
hsb(307, 35%, 49%)
CMYK
cmyk(0%, 35%, 4%, 51%)
Oklch
oklch(49.8% 0.081 330.8)

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

#F04F82

Rouge · LightCoral · Rose Pink

HEX
#F04F82
RGB
rgb(240, 79, 130)
HSL
hsl(341, 84%, 63%)
HSB
hsb(341, 67%, 94%)
CMYK
cmyk(0%, 67%, 46%, 6%)
Oklch
oklch(66.2% 0.200 5.1)

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

#F7824F

Apricot · Coral · Warm Sun

HEX
#F7824F
RGB
rgb(247, 130, 79)
HSL
hsl(18, 91%, 64%)
HSB
hsb(18, 68%, 97%)
CMYK
cmyk(0%, 47%, 68%, 3%)
Oklch
oklch(72.9% 0.158 43.2)

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

#E6E5CF

Fresh Green · Beige · Lemon Cream

HEX
#E6E5CF
RGB
rgb(230, 229, 207)
HSL
hsl(57, 32%, 86%)
HSB
hsb(57, 10%, 90%)
CMYK
cmyk(0%, 0%, 10%, 10%)
Oklch
oklch(91.7% 0.029 104.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2F827E
832F33

Analogous

2F8355
2F827E
2F5D83

Triadic

2F827E
7F2F83
837F2F

Split-Comp.

2F827E
832F5D
83552F

Tetradic

2F827E
552F83
832F33
5D832F

Contrast Matrix WCAG 2.1 Contrast

2F827E
7D5178
F04F82
F7824F
E6E5CF
—
1.4
Fail
1.3
Fail
1.8
Fail
3.6
AA Large
1.4
Fail
—
1.9
Fail
2.5
Fail
5.0
AA
1.3
Fail
1.9
Fail
—
1.3
Fail
2.7
Fail
1.8
Fail
2.5
Fail
1.3
Fail
—
2.0
Fail
3.6
AA Large
5.0
AA
2.7
Fail
2.0
Fail
—
White BG
4.6AA
6.3AA
3.4AA Large
2.5Fail
1.3Fail
Black BG
4.6AA
3.3AA Large
6.1AA
8.3AAA
16.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

53547F
6A6A6F
AAA976
C4C35B
E6E6D4

Deuteranopia

4E487F
6D706C
B4C073
CBD45E
E6E6D6

Tritanopia

338080
7B6765
E86C6A
F16567
E6D9D9

Achromatopsia

696969
636363
858585
9F9F9F
E3E3E3

Shades & Tints Shades & Tints

#2F827E

Dark
Light

#7D5178

Dark
Light

#F04F82

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2f827e;
  --color-2: #7d5178;
  --color-3: #f04f82;
  --color-4: #f7824f;
  --color-5: #e6e5cf;
}

SCSS

$color-1: #2f827e;
$color-2: #7d5178;
$color-3: #f04f82;
$color-4: #f7824f;
$color-5: #e6e5cf;

TAILWIND

colors: {
  'brand-1': '#2f827e',
  'brand-2': '#7d5178',
  'brand-3': '#f04f82',
  'brand-4': '#f7824f',
  'brand-5': '#e6e5cf',
}

RGB Array

[47, 130, 126], [125, 81, 120], [240, 79, 130], [247, 130, 79], [230, 229, 207]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2F827E, #7D5178, #F04F82, #F7824F, #E6E5CF 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: #2f827e; --color-2: #7d5178; --color-3: #f04f82; --color-4: #f7824f; --color-5: #e6e5cf. 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