#958FDB + #65509F + #BBDF6D + #5CC694 + #CAECB5 · spring - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#958FDB

Wisteria · MediumSlateBlue · Cobalt Blue

HEX

#958FDB

RGB

rgb(149, 143, 219)

HSL

hsl(245, 51%, 71%)

HSB

hsb(245, 35%, 86%)

CMYK

cmyk(32%, 35%, 0%, 14%)

Oklch

oklch(68.5% 0.111 286.7)

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

#65509F

Deep Indigo · DarkSlateBlue · Navy Blue

HEX

#65509F

RGB

rgb(101, 80, 159)

HSL

hsl(256, 33%, 47%)

HSB

hsb(256, 50%, 62%)

CMYK

cmyk(36%, 50%, 0%, 38%)

Oklch

oklch(49.0% 0.123 293.6)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#BBDF6D

Willow Green · LightGreen · Apple Green

HEX

#BBDF6D

RGB

rgb(187, 223, 109)

HSL

hsl(79, 64%, 65%)

HSB

hsb(79, 51%, 87%)

CMYK

cmyk(16%, 0%, 51%, 13%)

Oklch

oklch(85.4% 0.147 124.0)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#5CC694

Mineral Blue · MediumAquaMarine · Olive Green

HEX

#5CC694

RGB

rgb(92, 198, 148)

HSL

hsl(152, 48%, 57%)

HSB

hsb(152, 54%, 78%)

CMYK

cmyk(54%, 0%, 25%, 22%)

Oklch

oklch(75.0% 0.123 160.8)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#CAECB5

Emerald · LightGray · Mint Green

HEX

#CAECB5

RGB

rgb(202, 236, 181)

HSL

hsl(97, 59%, 82%)

HSB

hsb(97, 23%, 93%)

CMYK

cmyk(14%, 0%, 23%, 7%)

Oklch

oklch(90.5% 0.081 133.7)

Traditional「Emerald」· Paint「Mint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

958FDB

D4DB8F

Analogous

8FAFDB

958FDB

BB8FDB

Triadic

958FDB

DB968F

8FDB96

Split-Comp.

958FDB

DBBB8F

AFDB8F

Tetradic

958FDB

DB8FAF

D4DB8F

8FDBBB

Contrast Matrix WCAG 2.1 Contrast

958FDB	65509F	BBDF6D	5CC694	CAECB5
—	2.3 Fail	1.9 Fail	1.4 Fail	2.2 Fail
2.3 Fail	—	4.3 AA Large	3.1 AA Large	5.1 AA
1.9 Fail	4.3 AA Large	—	1.4 Fail	1.2 Fail
1.4 Fail	3.1 AA Large	1.4 Fail	—	1.6 Fail
2.2 Fail	5.1 AA	1.2 Fail	1.6 Fail	—

White BG

2.9Fail

6.6AA

1.5Fail

2.1Fail

1.3Fail

Black BG

7.2AAA

3.2AA Large

13.9AAA

10.0AAA

16.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9292C9

5C5C8C

CBCB89

8A8BA0

D9D9C2

Deuteranopia

9393C4

5D5F87

C9C68F

847CA3

D7D4C6

Tritanopia

95BAB7

647D79

BD9EA3

61AAAC

CCCDCF

Achromatopsia

999999

5F5F5F

C7C7C7

A1A1A1

DCDCDC

Shades & Tints Shades & Tints

#958FDB

Dark

Light

#65509F

Dark

Light

#BBDF6D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #958fdb;
  --color-2: #65509f;
  --color-3: #bbdf6d;
  --color-4: #5cc694;
  --color-5: #caecb5;
}

SCSS

$color-1: #958fdb;
$color-2: #65509f;
$color-3: #bbdf6d;
$color-4: #5cc694;
$color-5: #caecb5;

TAILWIND

colors: {
  'brand-1': '#958fdb',
  'brand-2': '#65509f',
  'brand-3': '#bbdf6d',
  'brand-4': '#5cc694',
  'brand-5': '#caecb5',
}

RGB Array

[149, 143, 219], [101, 80, 159], [187, 223, 109], [92, 198, 148], [202, 236, 181]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This spring-style palette of #958FDB, #65509F, #BBDF6D, #5CC694, #CAECB5 is ideal for: corporate websites, product showcases, portfolios. 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: #958fdb; --color-2: #65509f; --color-3: #bbdf6d; --color-4: #5cc694; --color-5: #caecb5. 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. 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 spring-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