#F3EFBF + #9EACDB + #9E95CE + #9A86C5 + #805C9A - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F3EFBF

Fresh Green · Bisque · Lemon Cream

HEX

#F3EFBF

RGB

rgb(243, 239, 191)

HSL

hsl(55, 68%, 85%)

HSB

hsb(55, 21%, 95%)

CMYK

cmyk(0%, 2%, 21%, 5%)

Oklch

oklch(94.3% 0.062 103.6)

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

#9EACDB

Azure · LightSteelBlue · Cobalt Blue

HEX

#9EACDB

RGB

rgb(158, 172, 219)

HSL

hsl(226, 46%, 74%)

HSB

hsb(226, 28%, 86%)

CMYK

cmyk(28%, 21%, 0%, 14%)

Oklch

oklch(75.0% 0.070 271.7)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#9E95CE

Wisteria · DarkGray · Cobalt Blue

HEX

#9E95CE

RGB

rgb(158, 149, 206)

HSL

hsl(249, 37%, 70%)

HSB

hsb(249, 28%, 81%)

CMYK

cmyk(23%, 28%, 0%, 19%)

Oklch

oklch(69.8% 0.083 291.3)

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

#9A86C5

Wisteria · DarkGray · Cobalt Blue

HEX

#9A86C5

RGB

rgb(154, 134, 197)

HSL

hsl(259, 35%, 65%)

HSB

hsb(259, 32%, 77%)

CMYK

cmyk(22%, 32%, 0%, 23%)

Oklch

oklch(66.2% 0.094 298.4)

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

#805C9A

Dark Plum · SlateGray · Violet

HEX

#805C9A

RGB

rgb(128, 92, 154)

HSL

hsl(275, 25%, 48%)

HSB

hsb(275, 40%, 60%)

CMYK

cmyk(17%, 40%, 0%, 40%)

Oklch

oklch(53.7% 0.102 310.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F3EFBF

BFC3F3

Analogous

F3D4BF

F3EFBF

DDF3BF

Triadic

F3EFBF

BFF3EE

EEBFF3

Split-Comp.

F3EFBF

BFDDF3

D4BFF3

Tetradic

F3EFBF

BFF3D4

BFC3F3

F3BFDD

Contrast Matrix WCAG 2.1 Contrast

F3EFBF	9EACDB	9E95CE	9A86C5	805C9A
—	1.9 Fail	2.3 Fail	2.7 Fail	4.6 AA
1.9 Fail	—	1.2 Fail	1.4 Fail	2.4 Fail
2.3 Fail	1.2 Fail	—	1.2 Fail	2.0 Fail
2.7 Fail	1.4 Fail	1.2 Fail	—	1.7 Fail
4.6 AA	2.4 Fail	2.0 Fail	1.7 Fail	—

White BG

1.2Fail

2.2Fail

2.7Fail

3.2AA Large

5.4AA

Black BG

17.9AAA

9.4AAA

7.6AAA

6.6AA

3.9AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

F1F1CB

A4A4D0

9A9AC0

9191B6

70708B

Deuteranopia

F2F2CD

A3A2CD

9B9BBD

9394B2

737587

Tritanopia

F3D4D6

9FC7C5

9EB5B3

99AAA7

7E7F7D

Achromatopsia

EBEBEB

ADADAD

9E9E9E

939393

6E6E6E

Shades & Tints Shades & Tints

#F3EFBF

Dark

Light

#9EACDB

Dark

Light

#9E95CE

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f3efbf;
  --color-2: #9eacdb;
  --color-3: #9e95ce;
  --color-4: #9a86c5;
  --color-5: #805c9a;
}

SCSS

$color-1: #f3efbf;
$color-2: #9eacdb;
$color-3: #9e95ce;
$color-4: #9a86c5;
$color-5: #805c9a;

TAILWIND

colors: {
  'brand-1': '#f3efbf',
  'brand-2': '#9eacdb',
  'brand-3': '#9e95ce',
  'brand-4': '#9a86c5',
  'brand-5': '#805c9a',
}

RGB Array

[243, 239, 191], [158, 172, 219], [158, 149, 206], [154, 134, 197], [128, 92, 154]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F3EFBF, #9EACDB, #9E95CE, #9A86C5, #805C9A 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: #f3efbf; --color-2: #9eacdb; --color-3: #9e95ce; --color-4: #9a86c5; --color-5: #805c9a. 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