← Back to Editor

#B4B78B · #92C76A · #3ED6D6 · #A9FC9D · #E5EADE

pastel

A 5-color pastel palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetCool

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#B4B78B

Fresh Green · Tan · Sunflower

HEX
#B4B78B
RGB
rgb(180, 183, 139)
HSL
hsl(64, 23%, 63%)
HSB
hsb(64, 24%, 72%)
CMYK
cmyk(2%, 0%, 24%, 28%)
Oklch
oklch(76.6% 0.060 111.0)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

#92C76A

Celadon · DarkSeaGreen · Olive Green

HEX
#92C76A
RGB
rgb(146, 199, 106)
HSL
hsl(94, 45%, 60%)
HSB
hsb(94, 47%, 78%)
CMYK
cmyk(27%, 0%, 47%, 22%)
Oklch
oklch(77.1% 0.135 133.1)

TraditionalCeladon」· PaintOlive Green」· Creative Blush Sunrise

#3ED6D6

Lake Blue · Turquoise · Lake Green

HEX
#3ED6D6
RGB
rgb(62, 214, 214)
HSL
hsl(180, 65%, 54%)
HSB
hsb(180, 71%, 84%)
CMYK
cmyk(71%, 0%, 0%, 16%)
Oklch
oklch(80.0% 0.123 195.0)

TraditionalLake Blue」· PaintLake Green」· Creative Blush Sunrise

#A9FC9D

Emerald · LightGreen · Apple Green

HEX
#A9FC9D
RGB
rgb(169, 252, 157)
HSL
hsl(112, 94%, 80%)
HSB
hsb(112, 38%, 99%)
CMYK
cmyk(33%, 0%, 38%, 1%)
Oklch
oklch(91.5% 0.150 141.3)

TraditionalEmerald」· PaintApple Green」· Creative Mint Breeze

#E5EADE

Willow Green · Beige · Mint Green

HEX
#E5EADE
RGB
rgb(229, 234, 222)
HSL
hsl(85, 22%, 89%)
HSB
hsb(85, 5%, 92%)
CMYK
cmyk(2%, 0%, 5%, 8%)
Oklch
oklch(93.0% 0.017 125.3)

TraditionalWillow Green」· PaintMint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B4B78B
8E8BB6

Analogous

B6A48B
B4B78B
9EB68B

Triadic

B4B78B
8BB3B6
B68BB3

Split-Comp.

B4B78B
8B9EB6
A48BB6

Tetradic

B4B78B
8BB6A4
8E8BB6
B68B9E

Contrast Matrix WCAG 2.1 Contrast

B4B78B
92C76A
3ED6D6
A9FC9D
E5EADE
1.1
Fail
1.2
Fail
1.7
Fail
1.7
Fail
1.1
Fail
1.1
Fail
1.6
Fail
1.6
Fail
1.2
Fail
1.1
Fail
1.4
Fail
1.5
Fail
1.7
Fail
1.6
Fail
1.4
Fail
1.0
Fail
1.7
Fail
1.6
Fail
1.5
Fail
1.0
Fail
White BG
2.1Fail
2.0Fail
1.8Fail
1.2Fail
1.2Fail
Black BG
10.1AAA
10.6AAA
11.8AAA
17.1AAA
17.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B5B596
A9A981
8081D6
CDCEB4
E7E7E1

Deuteranopia

B5B598
A6A286
776CD6
C8C2BA
E7E7E2

Tritanopia

B49EA0
959296
46D6D6
ADC6CA
E5E3E4

Achromatopsia

B1B1B1
ADADAD
A9A9A9
D8D8D8
E7E7E7

Shades & Tints Shades & Tints

#B4B78B

Dark
Light

#92C76A

Dark
Light

#3ED6D6

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b4b78b;
  --color-2: #92c76a;
  --color-3: #3ed6d6;
  --color-4: #a9fc9d;
  --color-5: #e5eade;
}

SCSS

$color-1: #b4b78b;
$color-2: #92c76a;
$color-3: #3ed6d6;
$color-4: #a9fc9d;
$color-5: #e5eade;

TAILWIND

colors: {
  'brand-1': '#b4b78b',
  'brand-2': '#92c76a',
  'brand-3': '#3ed6d6',
  'brand-4': '#a9fc9d',
  'brand-5': '#e5eade',
}

RGB Array

[180, 183, 139], [146, 199, 106], [62, 214, 214], [169, 252, 157], [229, 234, 222]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #B4B78B, #92C76A, #3ED6D6, #A9FC9D, #E5EADE 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: #b4b78b; --color-2: #92c76a; --color-3: #3ed6d6; --color-4: #a9fc9d; --color-5: #e5eade. 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 pastel-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