#7C95A6 + #B88FA3 + #E396AC + #FFB399 + #E6C883 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#7C95A6

Slate Blue · LightSlateGray · Navy Blue

HEX

#7C95A6

RGB

rgb(124, 149, 166)

HSL

hsl(204, 19%, 57%)

HSB

hsb(204, 25%, 65%)

CMYK

cmyk(25%, 10%, 0%, 35%)

Oklch

oklch(65.6% 0.038 237.9)

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

#B88FA3

Rouge · DarkGray · Rose Pink

HEX

#B88FA3

RGB

rgb(184, 143, 163)

HSL

hsl(331, 22%, 64%)

HSB

hsb(331, 22%, 72%)

CMYK

cmyk(0%, 22%, 11%, 28%)

Oklch

oklch(69.5% 0.056 347.8)

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

#E396AC

Rouge · Tan · Rose Pink

HEX

#E396AC

RGB

rgb(227, 150, 172)

HSL

hsl(343, 58%, 74%)

HSB

hsb(343, 34%, 89%)

CMYK

cmyk(0%, 34%, 24%, 11%)

Oklch

oklch(75.6% 0.096 1.1)

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

#FFB399

Apricot · LightSalmon · Peach Orange

HEX

#FFB399

RGB

rgb(255, 179, 153)

HSL

hsl(15, 100%, 80%)

HSB

hsb(15, 40%, 100%)

CMYK

cmyk(0%, 30%, 40%, 0%)

Oklch

oklch(83.3% 0.096 39.7)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#E6C883

Goose Yellow · BurlyWood · Sunflower

HEX

#E6C883

RGB

rgb(230, 200, 131)

HSL

hsl(42, 66%, 71%)

HSB

hsb(42, 43%, 90%)

CMYK

cmyk(0%, 13%, 43%, 10%)

Oklch

oklch(84.3% 0.094 86.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7C95A6

A68D7D

Analogous

7DA6A2

7C95A6

7D81A6

Triadic

7C95A6

A67D96

96A67D

Split-Comp.

7C95A6

A67D81

A6A27D

Tetradic

7C95A6

A27DA6

A68D7D

81A67D

Contrast Matrix WCAG 2.1 Contrast

7C95A6	B88FA3	E396AC	FFB399	E6C883
—	1.1 Fail	1.4 Fail	1.8 Fail	1.9 Fail
1.1 Fail	—	1.2 Fail	1.6 Fail	1.7 Fail
1.4 Fail	1.2 Fail	—	1.3 Fail	1.4 Fail
1.8 Fail	1.6 Fail	1.3 Fail	—	1.1 Fail
1.9 Fail	1.7 Fail	1.4 Fail	1.1 Fail	—

White BG

3.1AA Large

2.8Fail

2.3Fail

1.7Fail

1.6Fail

Black BG

6.7AA

7.5AAA

9.2AAA

12.2AAA

13.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8787A2

A6A69E

C2C1A7

DEDD9F

D9D994

Deuteranopia

8584A1

A9AC9D

C6CCA5

E3E8A1

DBDD98

Tritanopia

7D9F9E

B69A9A

DFA2A2

FBA4A5

E5A1A4

Achromatopsia

8F8F8F

9E9E9E

B0B0B0

C7C7C7

C9C9C9

Shades & Tints Shades & Tints

#7C95A6

Dark

Light

#B88FA3

Dark

Light

#E396AC

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7c95a6;
  --color-2: #b88fa3;
  --color-3: #e396ac;
  --color-4: #ffb399;
  --color-5: #e6c883;
}

SCSS

$color-1: #7c95a6;
$color-2: #b88fa3;
$color-3: #e396ac;
$color-4: #ffb399;
$color-5: #e6c883;

TAILWIND

colors: {
  'brand-1': '#7c95a6',
  'brand-2': '#b88fa3',
  'brand-3': '#e396ac',
  'brand-4': '#ffb399',
  'brand-5': '#e6c883',
}

RGB Array

[124, 149, 166], [184, 143, 163], [227, 150, 172], [255, 179, 153], [230, 200, 131]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7C95A6, #B88FA3, #E396AC, #FFB399, #E6C883 is ideal for: health products, baby brands, fresh-style blogs. 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: #7c95a6; --color-2: #b88fa3; --color-3: #e396ac; --color-4: #ffb399; --color-5: #e6c883. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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