#EDE6AF + #BACAA6 + #8FB199 + #F5DD73 + #ED227B · spring - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#EDE6AF

Fresh Green · Wheat · Lemon Cream

HEX

#EDE6AF

RGB

rgb(237, 230, 175)

HSL

hsl(53, 63%, 81%)

HSB

hsb(53, 26%, 93%)

CMYK

cmyk(0%, 3%, 26%, 7%)

Oklch

oklch(91.7% 0.071 101.6)

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

#BACAA6

Willow Green · Silver · Apple Green

HEX

#BACAA6

RGB

rgb(186, 202, 166)

HSL

hsl(87, 25%, 72%)

HSB

hsb(87, 18%, 79%)

CMYK

cmyk(8%, 0%, 18%, 21%)

Oklch

oklch(81.7% 0.052 127.1)

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

#8FB199

Celadon · DarkSeaGreen · Apple Green

HEX

#8FB199

RGB

rgb(143, 177, 153)

HSL

hsl(138, 18%, 63%)

HSB

hsb(138, 19%, 69%)

CMYK

cmyk(19%, 0%, 14%, 31%)

Oklch

oklch(72.8% 0.051 154.2)

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

#F5DD73

Goose Yellow · Khaki · Sunflower

HEX

#F5DD73

RGB

rgb(245, 221, 115)

HSL

hsl(49, 87%, 71%)

HSB

hsb(49, 53%, 96%)

CMYK

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

Oklch

oklch(89.6% 0.129 96.8)

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

#ED227B

Dark Violet · DeepPink · Rose Pink

HEX

#ED227B

RGB

rgb(237, 34, 123)

HSL

hsl(334, 85%, 53%)

HSB

hsb(334, 86%, 93%)

CMYK

cmyk(0%, 86%, 48%, 7%)

Oklch

oklch(62.1% 0.236 2.2)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EDE6AF

B0B7ED

Analogous

EDC7B0

EDE6AF

D6EDB0

Triadic

EDE6AF

B0EDE6

E6B0ED

Split-Comp.

EDE6AF

B0D6ED

C7B0ED

Tetradic

EDE6AF

B0EDC7

B0B7ED

EDB0D6

Contrast Matrix WCAG 2.1 Contrast

EDE6AF	BACAA6	8FB199	F5DD73	ED227B
—	1.4 Fail	1.9 Fail	1.1 Fail	3.2 AA Large
1.4 Fail	—	1.4 Fail	1.3 Fail	2.4 Fail
1.9 Fail	1.4 Fail	—	1.7 Fail	1.7 Fail
1.1 Fail	1.3 Fail	1.7 Fail	—	3.0 AA Large
3.2 AA Large	2.4 Fail	1.7 Fail	3.0 AA Large	—

White BG

1.3Fail

1.7Fail

2.4Fail

1.4Fail

4.1AA Large

Black BG

16.5AAA

12.1AAA

8.9AAA

15.5AAA

5.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EAEABC

C1C1AF

9E9E9F

EBEA8D

959365

Deuteranopia

EAEBC0

C0BFB1

9C99A0

ECEE93

A1B060

Tritanopia

EDC7C9

BBB6B7

91A3A4

F4A1A5

E35451

Achromatopsia

E2E2E2

C1C1C1

A4A4A4

D8D8D8

696969

Shades & Tints Shades & Tints

#EDE6AF

Dark

Light

#BACAA6

Dark

Light

#8FB199

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ede6af;
  --color-2: #bacaa6;
  --color-3: #8fb199;
  --color-4: #f5dd73;
  --color-5: #ed227b;
}

SCSS

$color-1: #ede6af;
$color-2: #bacaa6;
$color-3: #8fb199;
$color-4: #f5dd73;
$color-5: #ed227b;

TAILWIND

colors: {
  'brand-1': '#ede6af',
  'brand-2': '#bacaa6',
  'brand-3': '#8fb199',
  'brand-4': '#f5dd73',
  'brand-5': '#ed227b',
}

RGB Array

[237, 230, 175], [186, 202, 166], [143, 177, 153], [245, 221, 115], [237, 34, 123]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This spring-style palette of #EDE6AF, #BACAA6, #8FB199, #F5DD73, #ED227B 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: #ede6af; --color-2: #bacaa6; --color-3: #8fb199; --color-4: #f5dd73; --color-5: #ed227b. 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