#BDD694 + #D7E8BB + #E2EDD1 + #E8C6A1 + #E08383 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BDD694

Willow Green · Tan · Apple Green

HEX

#BDD694

RGB

rgb(189, 214, 148)

HSL

hsl(83, 45%, 71%)

HSB

hsb(83, 31%, 84%)

CMYK

cmyk(12%, 0%, 31%, 16%)

Oklch

oklch(84.1% 0.092 125.2)

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

#D7E8BB

Willow Green · LightGray · Mint Green

HEX

#D7E8BB

RGB

rgb(215, 232, 187)

HSL

hsl(83, 49%, 82%)

HSB

hsb(83, 19%, 91%)

CMYK

cmyk(7%, 0%, 19%, 9%)

Oklch

oklch(90.7% 0.062 124.5)

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

#E2EDD1

Willow Green · Beige · Mint Green

HEX

#E2EDD1

RGB

rgb(226, 237, 209)

HSL

hsl(84, 44%, 87%)

HSB

hsb(84, 12%, 93%)

CMYK

cmyk(5%, 0%, 12%, 7%)

Oklch

oklch(93.0% 0.039 124.7)

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

#E8C6A1

Goose Yellow · BurlyWood · Peach Orange

HEX

#E8C6A1

RGB

rgb(232, 198, 161)

HSL

hsl(31, 61%, 77%)

HSB

hsb(31, 31%, 91%)

CMYK

cmyk(0%, 15%, 31%, 9%)

Oklch

oklch(84.7% 0.063 69.2)

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

#E08383

Peach Pink · LightCoral · Coral Red

HEX

#E08383

RGB

rgb(224, 131, 131)

HSL

hsl(0, 60%, 70%)

HSB

hsb(0, 42%, 88%)

CMYK

cmyk(0%, 42%, 42%, 12%)

Oklch

oklch(71.0% 0.115 20.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BDD694

AD94D6

Analogous

D6CF94

BDD694

9CD694

Triadic

BDD694

94BDD6

D694BD

Split-Comp.

BDD694

949CD6

CF94D6

Tetradic

BDD694

94D6CF

AD94D6

D6949C

Contrast Matrix WCAG 2.1 Contrast

BDD694	D7E8BB	E2EDD1	E8C6A1	E08383
—	1.2 Fail	1.3 Fail	1.0 Fail	1.7 Fail
1.2 Fail	—	1.1 Fail	1.2 Fail	2.1 Fail
1.3 Fail	1.1 Fail	—	1.3 Fail	2.2 Fail
1.0 Fail	1.2 Fail	1.3 Fail	—	1.7 Fail
1.7 Fail	2.1 Fail	2.2 Fail	1.7 Fail	—

White BG

1.6Fail

1.3Fail

1.2Fail

1.6Fail

2.7Fail

Black BG

13.2AAA

16.1AAA

17.3AAA

13.0AAA

7.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C8C8A4

DEDFC6

E7E7D8

D9D9AA

B8B783

Deuteranopia

C6C5A8

DDDCC9

E6E5D9

DBDEAC

BDC483

Tritanopia

BEB1B3

D8CED0

E3DDDE

E6B1B3

DB8383

Achromatopsia

C7C7C7

DEDEDE

E7E7E7

CCCCCC

9F9F9F

Shades & Tints Shades & Tints

#BDD694

Dark

Light

#D7E8BB

Dark

Light

#E2EDD1

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bdd694;
  --color-2: #d7e8bb;
  --color-3: #e2edd1;
  --color-4: #e8c6a1;
  --color-5: #e08383;
}

SCSS

$color-1: #bdd694;
$color-2: #d7e8bb;
$color-3: #e2edd1;
$color-4: #e8c6a1;
$color-5: #e08383;

TAILWIND

colors: {
  'brand-1': '#bdd694',
  'brand-2': '#d7e8bb',
  'brand-3': '#e2edd1',
  'brand-4': '#e8c6a1',
  'brand-5': '#e08383',
}

RGB Array

[189, 214, 148], [215, 232, 187], [226, 237, 209], [232, 198, 161], [224, 131, 131]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BDD694, #D7E8BB, #E2EDD1, #E8C6A1, #E08383 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: #bdd694; --color-2: #d7e8bb; --color-3: #e2edd1; --color-4: #e8c6a1; --color-5: #e08383. 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