#B55C72 + #F5BCB1 + #81CCC5 + #B2D2C3 + #EFE1C4 · spring - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#B55C72

Crimson · Gray · Passion Red

HEX

#B55C72

RGB

rgb(181, 92, 114)

HSL

hsl(345, 38%, 54%)

HSB

hsb(345, 49%, 71%)

CMYK

cmyk(0%, 49%, 37%, 29%)

Oklch

oklch(58.7% 0.117 5.7)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#F5BCB1

Peach Pink · LightPink · Cherry Blossom

HEX

#F5BCB1

RGB

rgb(245, 188, 177)

HSL

hsl(10, 77%, 83%)

HSB

hsb(10, 28%, 96%)

CMYK

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

Oklch

oklch(84.4% 0.068 31.0)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#81CCC5

Jade · MediumAquaMarine · Lake Green

HEX

#81CCC5

RGB

rgb(129, 204, 197)

HSL

hsl(174, 42%, 65%)

HSB

hsb(174, 37%, 80%)

CMYK

cmyk(37%, 0%, 3%, 20%)

Oklch

oklch(79.4% 0.075 188.2)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#B2D2C3

Jade · Silver · Apple Green

HEX

#B2D2C3

RGB

rgb(178, 210, 195)

HSL

hsl(152, 26%, 76%)

HSB

hsb(152, 15%, 82%)

CMYK

cmyk(15%, 0%, 7%, 18%)

Oklch

oklch(83.6% 0.040 165.4)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#EFE1C4

Goose Yellow · Bisque · Lemon Cream

HEX

#EFE1C4

RGB

rgb(239, 225, 196)

HSL

hsl(40, 57%, 85%)

HSB

hsb(40, 18%, 94%)

CMYK

cmyk(0%, 6%, 18%, 6%)

Oklch

oklch(91.3% 0.041 85.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B55C72

5DB6A0

Analogous

B65DA0

B55C72

B6735D

Triadic

B55C72

73B65D

5D73B6

Split-Comp.

B55C72

5DB673

5DA0B6

Tetradic

B55C72

A0B65D

5DB6A0

735DB6

Contrast Matrix WCAG 2.1 Contrast

B55C72	F5BCB1	81CCC5	B2D2C3	EFE1C4
—	2.7 Fail	2.4 Fail	2.7 Fail	3.4 AA Large
2.7 Fail	—	1.1 Fail	1.0 Fail	1.3 Fail
2.4 Fail	1.1 Fail	—	1.1 Fail	1.4 Fail
2.7 Fail	1.0 Fail	1.1 Fail	—	1.3 Fail
3.4 AA Large	1.3 Fail	1.4 Fail	1.3 Fail	—

White BG

4.4AA Large

1.7Fail

1.8Fail

1.6Fail

1.3Fail

Black BG

4.7AA

12.7AAA

11.4AAA

12.9AAA

16.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8E8E6D

DCDCB4

A1A2C7

C0C0C7

E9E9CB

Deuteranopia

949A6B

E0E4B4

9D98C7

BEBCC8

EAEBCD

Tritanopia

B16868

F2B6B6

85C8C8

B4C9CA

EED1D2

Achromatopsia

797979

CCCCCC

B5B5B5

C7C7C7

E2E2E2

Shades & Tints Shades & Tints

#B55C72

Dark

Light

#F5BCB1

Dark

Light

#81CCC5

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b55c72;
  --color-2: #f5bcb1;
  --color-3: #81ccc5;
  --color-4: #b2d2c3;
  --color-5: #efe1c4;
}

SCSS

$color-1: #b55c72;
$color-2: #f5bcb1;
$color-3: #81ccc5;
$color-4: #b2d2c3;
$color-5: #efe1c4;

TAILWIND

colors: {
  'brand-1': '#b55c72',
  'brand-2': '#f5bcb1',
  'brand-3': '#81ccc5',
  'brand-4': '#b2d2c3',
  'brand-5': '#efe1c4',
}

RGB Array

[181, 92, 114], [245, 188, 177], [129, 204, 197], [178, 210, 195], [239, 225, 196]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This spring-style palette of #B55C72, #F5BCB1, #81CCC5, #B2D2C3, #EFE1C4 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: #b55c72; --color-2: #f5bcb1; --color-3: #81ccc5; --color-4: #b2d2c3; --color-5: #efe1c4. 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 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