← Back to Editor

#B3E4CE · #BBC57F · #D79274 · #B1518B · #895D79

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#B3E4CE

Jade · LightBlue · Apple Green

HEX
#B3E4CE
RGB
rgb(179, 228, 206)
HSL
hsl(153, 48%, 80%)
HSB
hsb(153, 21%, 89%)
CMYK
cmyk(21%, 0%, 10%, 11%)
Oklch
oklch(87.8% 0.059 165.9)

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

#BBC57F

Fresh Green · Tan · Sunflower

HEX
#BBC57F
RGB
rgb(187, 197, 127)
HSL
hsl(69, 38%, 64%)
HSB
hsb(69, 36%, 77%)
CMYK
cmyk(5%, 0%, 36%, 23%)
Oklch
oklch(79.9% 0.093 115.2)

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

#D79274

Apricot · DarkSalmon · Warm Sun

HEX
#D79274
RGB
rgb(215, 146, 116)
HSL
hsl(18, 55%, 65%)
HSB
hsb(18, 46%, 84%)
CMYK
cmyk(0%, 32%, 46%, 16%)
Oklch
oklch(72.2% 0.094 44.3)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#B1518B

Rose Purple · MediumVioletRed · Rose Pink

HEX
#B1518B
RGB
rgb(177, 81, 139)
HSL
hsl(324, 38%, 51%)
HSB
hsb(324, 54%, 69%)
CMYK
cmyk(0%, 54%, 21%, 31%)
Oklch
oklch(57.4% 0.142 345.3)

Traditional「Rose Purple」· Paint「Rose Pink」· Creative Blush Sunrise

#895D79

Rose Purple · Gray · Camellia

HEX
#895D79
RGB
rgb(137, 93, 121)
HSL
hsl(322, 19%, 45%)
HSB
hsb(322, 32%, 54%)
CMYK
cmyk(0%, 32%, 12%, 46%)
Oklch
oklch(53.5% 0.070 341.2)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B3E4CE
E4B4CA

Analogous

B4E4B6
B3E4CE
B4E2E4

Triadic

B3E4CE
CEB4E4
E4CEB4

Split-Comp.

B3E4CE
E4B4E2
E4B6B4

Tetradic

B3E4CE
B6B4E4
E4B4CA
E2E4B4

Contrast Matrix WCAG 2.1 Contrast

B3E4CE
BBC57F
D79274
B1518B
895D79
—
1.3
Fail
1.8
Fail
3.4
AA Large
3.8
AA Large
1.3
Fail
—
1.4
Fail
2.6
Fail
2.9
Fail
1.8
Fail
1.4
Fail
—
1.9
Fail
2.1
Fail
3.4
AA Large
2.6
Fail
1.9
Fail
—
1.1
Fail
3.8
AA Large
2.9
Fail
2.1
Fail
1.1
Fail
—
White BG
1.4Fail
1.8Fail
2.5Fail
4.8AA
5.4AA
Black BG
14.9AAA
11.4AAA
8.3AAA
4.4AA Large
3.9AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

C8C9D3
BFBF90
B9B97B
87877D
767672

Deuteranopia

C5C2D5
BFBE94
BDC27D
8D947A
797C71

Tritanopia

B5D8D8
BC9DA0
D48182
AC726F
876D6C

Achromatopsia

D3D3D3
BABABA
A3A3A3
747474
6D6D6D

Shades & Tints Shades & Tints

#B3E4CE

Dark
Light

#BBC57F

Dark
Light

#D79274

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b3e4ce;
  --color-2: #bbc57f;
  --color-3: #d79274;
  --color-4: #b1518b;
  --color-5: #895d79;
}

SCSS

$color-1: #b3e4ce;
$color-2: #bbc57f;
$color-3: #d79274;
$color-4: #b1518b;
$color-5: #895d79;

TAILWIND

colors: {
  'brand-1': '#b3e4ce',
  'brand-2': '#bbc57f',
  'brand-3': '#d79274',
  'brand-4': '#b1518b',
  'brand-5': '#895d79',
}

RGB Array

[179, 228, 206], [187, 197, 127], [215, 146, 116], [177, 81, 139], [137, 93, 121]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B3E4CE, #BBC57F, #D79274, #B1518B, #895D79 is ideal for: corporate websites, product showcases, portfolios. 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: #b3e4ce; --color-2: #bbc57f; --color-3: #d79274; --color-4: #b1518b; --color-5: #895d79. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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