#B0899F + #D0C7BC + #D5DEBA + #E6FA96 + #B5FA1C · spring - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#B0899F

Mauve · DarkGray · Rose Pink

HEX

#B0899F

RGB

rgb(176, 137, 159)

HSL

hsl(326, 20%, 61%)

HSB

hsb(326, 22%, 69%)

CMYK

cmyk(0%, 22%, 10%, 31%)

Oklch

oklch(67.4% 0.056 343.8)

Traditional「Mauve」· Paint「Rose Pink」· Creative Rose Petal

#D0C7BC

Goose Yellow · Silver · Peach Orange

HEX

#D0C7BC

RGB

rgb(208, 199, 188)

HSL

hsl(33, 18%, 78%)

HSB

hsb(33, 10%, 82%)

CMYK

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

Oklch

oklch(83.4% 0.018 73.0)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#D5DEBA

Willow Green · LightGray · Apple Green

HEX

#D5DEBA

RGB

rgb(213, 222, 186)

HSL

hsl(75, 35%, 80%)

HSB

hsb(75, 16%, 87%)

CMYK

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

Oklch

oklch(88.4% 0.049 118.8)

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

#E6FA96

Willow Green · Khaki · Apple Green

HEX

#E6FA96

RGB

rgb(230, 250, 150)

HSL

hsl(72, 91%, 78%)

HSB

hsb(72, 40%, 98%)

CMYK

cmyk(8%, 0%, 40%, 2%)

Oklch

oklch(94.9% 0.126 118.1)

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

#B5FA1C

Grass Green · GreenYellow · Olive Green

HEX

#B5FA1C

RGB

rgb(181, 250, 28)

HSL

hsl(79, 96%, 55%)

HSB

hsb(79, 89%, 98%)

CMYK

cmyk(28%, 0%, 89%, 2%)

Oklch

oklch(90.5% 0.230 127.4)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B0899F

88AF99

Analogous

AD88AF

B0899F

AF888A

Triadic

B0899F

9EAF88

889EAF

Split-Comp.

B0899F

8AAF88

88AFAD

Tetradic

B0899F

AFAD88

88AF99

888AAF

Contrast Matrix WCAG 2.1 Contrast

B0899F	D0C7BC	D5DEBA	E6FA96	B5FA1C
—	1.8 Fail	2.2 Fail	2.7 Fail	2.4 Fail
1.8 Fail	—	1.2 Fail	1.5 Fail	1.3 Fail
2.2 Fail	1.2 Fail	—	1.2 Fail	1.1 Fail
2.7 Fail	1.5 Fail	1.2 Fail	—	1.1 Fail
2.4 Fail	1.3 Fail	1.1 Fail	1.1 Fail	—

White BG

3.0AA Large

1.7Fail

1.4Fail

1.1Fail

1.3Fail

Black BG

6.9AA

12.6AAA

15.0AAA

18.5AAA

16.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9F9F9A

CCCCBF

D9D9C3

EFEFAE

D3D352

Deuteranopia

A1A498

CDCDBF

D8D8C5

EEECB4

CFCA5F

Tritanopia

AE9595

D0C1C1

D5CACB

E7C1C6

B87C85

Achromatopsia

979797

C8C8C8

D7D7D7

E9E9E9

CCCCCC

Shades & Tints Shades & Tints

#B0899F

Dark

Light

#D0C7BC

Dark

Light

#D5DEBA

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b0899f;
  --color-2: #d0c7bc;
  --color-3: #d5deba;
  --color-4: #e6fa96;
  --color-5: #b5fa1c;
}

SCSS

$color-1: #b0899f;
$color-2: #d0c7bc;
$color-3: #d5deba;
$color-4: #e6fa96;
$color-5: #b5fa1c;

TAILWIND

colors: {
  'brand-1': '#b0899f',
  'brand-2': '#d0c7bc',
  'brand-3': '#d5deba',
  'brand-4': '#e6fa96',
  'brand-5': '#b5fa1c',
}

RGB Array

[176, 137, 159], [208, 199, 188], [213, 222, 186], [230, 250, 150], [181, 250, 28]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This spring-style palette of #B0899F, #D0C7BC, #D5DEBA, #E6FA96, #B5FA1C 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: #b0899f; --color-2: #d0c7bc; --color-3: #d5deba; --color-4: #e6fa96; --color-5: #b5fa1c. 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