#F3958B + #FFC89D + #F6E3DC + #9A93B5 + #D5AECD - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F3958B

Peach Pink · DarkSalmon · Coral Red

HEX

#F3958B

RGB

rgb(243, 149, 139)

HSL

hsl(6, 81%, 75%)

HSB

hsb(6, 43%, 95%)

CMYK

cmyk(0%, 39%, 43%, 5%)

Oklch

oklch(76.4% 0.115 26.6)

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

#FFC89D

Apricot · Wheat · Peach Orange

HEX

#FFC89D

RGB

rgb(255, 200, 157)

HSL

hsl(26, 100%, 81%)

HSB

hsb(26, 38%, 100%)

CMYK

cmyk(0%, 22%, 38%, 0%)

Oklch

oklch(87.2% 0.084 59.4)

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

#F6E3DC

Apricot · Linen · Peach Orange

HEX

#F6E3DC

RGB

rgb(246, 227, 220)

HSL

hsl(16, 59%, 91%)

HSB

hsb(16, 11%, 96%)

CMYK

cmyk(0%, 8%, 11%, 4%)

Oklch

oklch(92.9% 0.023 41.4)

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

#9A93B5

Wisteria · DarkGray · Cobalt Blue

HEX

#9A93B5

RGB

rgb(154, 147, 181)

HSL

hsl(252, 19%, 64%)

HSB

hsb(252, 19%, 71%)

CMYK

cmyk(15%, 19%, 0%, 29%)

Oklch

oklch(68.1% 0.050 294.5)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#D5AECD

Mauve · Silver · Lilac Purple

HEX

#D5AECD

RGB

rgb(213, 174, 205)

HSL

hsl(312, 32%, 76%)

HSB

hsb(312, 18%, 84%)

CMYK

cmyk(0%, 18%, 4%, 16%)

Oklch

oklch(79.5% 0.061 333.3)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F3958B

8CE9F3

Analogous

F38CB5

F3958B

F3CA8C

Triadic

F3958B

8CF396

968CF3

Split-Comp.

F3958B

8CF3CA

8CB5F3

Tetradic

F3958B

B5F38C

8CE9F3

CA8CF3

Contrast Matrix WCAG 2.1 Contrast

F3958B	FFC89D	F6E3DC	9A93B5	D5AECD
—	1.5 Fail	1.8 Fail	1.3 Fail	1.1 Fail
1.5 Fail	—	1.2 Fail	1.9 Fail	1.3 Fail
1.8 Fail	1.2 Fail	—	2.3 Fail	1.6 Fail
1.3 Fail	1.9 Fail	2.3 Fail	—	1.5 Fail
1.1 Fail	1.3 Fail	1.6 Fail	1.5 Fail	—

White BG

2.2Fail

1.5Fail

1.2Fail

2.9Fail

2.0Fail

Black BG

9.5AAA

14.0AAA

16.9AAA

7.2AAA

10.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CAC98D

E7E7A7

EEEEDE

9797AD

C4C4C5

Deuteranopia

D0D78E

EAEFAA

EFF0DE

9798AB

C6C9C4

Tritanopia

EE8F90

FCB0B1

F5DFDF

9AA6A5

D3C0BE

Achromatopsia

B0B0B0

D4D4D4

E8E8E8

999999

BDBDBD

Shades & Tints Shades & Tints

#F3958B

Dark

Light

#FFC89D

Dark

Light

#F6E3DC

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f3958b;
  --color-2: #ffc89d;
  --color-3: #f6e3dc;
  --color-4: #9a93b5;
  --color-5: #d5aecd;
}

SCSS

$color-1: #f3958b;
$color-2: #ffc89d;
$color-3: #f6e3dc;
$color-4: #9a93b5;
$color-5: #d5aecd;

TAILWIND

colors: {
  'brand-1': '#f3958b',
  'brand-2': '#ffc89d',
  'brand-3': '#f6e3dc',
  'brand-4': '#9a93b5',
  'brand-5': '#d5aecd',
}

RGB Array

[243, 149, 139], [255, 200, 157], [246, 227, 220], [154, 147, 181], [213, 174, 205]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F3958B, #FFC89D, #F6E3DC, #9A93B5, #D5AECD 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: #f3958b; --color-2: #ffc89d; --color-3: #f6e3dc; --color-4: #9a93b5; --color-5: #d5aecd. 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