#7B95A7 + #9F90A4 + #D59998 + #F9C8A0 + #F4DCA4 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#7B95A7

Slate Blue · LightSlateGray · Navy Blue

HEX

#7B95A7

RGB

rgb(123, 149, 167)

HSL

hsl(205, 20%, 57%)

HSB

hsb(205, 26%, 65%)

CMYK

cmyk(26%, 11%, 0%, 35%)

Oklch

oklch(65.6% 0.040 238.4)

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

#9F90A4

Dark Plum · DarkGray · Violet

HEX

#9F90A4

RGB

rgb(159, 144, 164)

HSL

hsl(285, 10%, 60%)

HSB

hsb(285, 12%, 64%)

CMYK

cmyk(3%, 12%, 0%, 36%)

Oklch

oklch(67.3% 0.034 317.7)

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

#D59998

Peach Pink · Tan · Coral Red

HEX

#D59998

RGB

rgb(213, 153, 152)

HSL

hsl(1, 42%, 72%)

HSB

hsb(1, 29%, 84%)

CMYK

cmyk(0%, 28%, 29%, 16%)

Oklch

oklch(74.0% 0.072 20.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#F9C8A0

Apricot · Wheat · Peach Orange

HEX

#F9C8A0

RGB

rgb(249, 200, 160)

HSL

hsl(27, 88%, 80%)

HSB

hsb(27, 36%, 98%)

CMYK

cmyk(0%, 20%, 36%, 2%)

Oklch

oklch(86.6% 0.077 60.8)

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

#F4DCA4

Goose Yellow · Wheat · Lemon Cream

HEX

#F4DCA4

RGB

rgb(244, 220, 164)

HSL

hsl(42, 78%, 80%)

HSB

hsb(42, 33%, 96%)

CMYK

cmyk(0%, 10%, 33%, 4%)

Oklch

oklch(90.1% 0.077 87.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7B95A7

A78E7B

Analogous

7BA7A4

7B95A7

7B7FA7

Triadic

7B95A7

A77B95

95A77B

Split-Comp.

7B95A7

A77B7F

A7A47B

Tetradic

7B95A7

A47BA7

A78E7B

7FA77B

Contrast Matrix WCAG 2.1 Contrast

7B95A7	9F90A4	D59998	F9C8A0	F4DCA4
—	1.0 Fail	1.3 Fail	2.1 Fail	2.3 Fail
1.0 Fail	—	1.3 Fail	2.0 Fail	2.2 Fail
1.3 Fail	1.3 Fail	—	1.6 Fail	1.8 Fail
2.1 Fail	2.0 Fail	1.6 Fail	—	1.1 Fail
2.3 Fail	2.2 Fail	1.8 Fail	1.1 Fail	—

White BG

3.1AA Large

3.0AA Large

2.4Fail

1.5Fail

1.3Fail

Black BG

6.7AA

7.0AA

8.8AAA

13.8AAA

15.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8686A3

99989F

BBBA98

E4E3AA

EAE9B2

Deuteranopia

8583A2

999B9E

BFC398

E7EAAC

EBEDB5

Tritanopia

7C9F9E

9E9B9B

D29898

F7B1B3

F3BCBF

Achromatopsia

8F8F8F

979797

ABABAB

D2D2D2

DDDDDD

Shades & Tints Shades & Tints

#7B95A7

Dark

Light

#9F90A4

Dark

Light

#D59998

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7b95a7;
  --color-2: #9f90a4;
  --color-3: #d59998;
  --color-4: #f9c8a0;
  --color-5: #f4dca4;
}

SCSS

$color-1: #7b95a7;
$color-2: #9f90a4;
$color-3: #d59998;
$color-4: #f9c8a0;
$color-5: #f4dca4;

TAILWIND

colors: {
  'brand-1': '#7b95a7',
  'brand-2': '#9f90a4',
  'brand-3': '#d59998',
  'brand-4': '#f9c8a0',
  'brand-5': '#f4dca4',
}

RGB Array

[123, 149, 167], [159, 144, 164], [213, 153, 152], [249, 200, 160], [244, 220, 164]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7B95A7, #9F90A4, #D59998, #F9C8A0, #F4DCA4 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: #7b95a7; --color-2: #9f90a4; --color-3: #d59998; --color-4: #f9c8a0; --color-5: #f4dca4. 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