← Back to Editor

#B3C095 · #93A688 · #A3C9DC · #3F2F4C · #2D1C3E

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#B3C095

Willow Green · DarkGray · Apple Green

HEX
#B3C095
RGB
rgb(179, 192, 149)
HSL
hsl(78, 25%, 67%)
HSB
hsb(78, 22%, 75%)
CMYK
cmyk(7%, 0%, 22%, 25%)
Oklch
oklch(78.7% 0.060 121.5)

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

#93A688

Celadon · DarkSeaGreen · Olive Green

HEX
#93A688
RGB
rgb(147, 166, 136)
HSL
hsl(98, 14%, 59%)
HSB
hsb(98, 18%, 65%)
CMYK
cmyk(11%, 0%, 18%, 35%)
Oklch
oklch(70.2% 0.048 134.1)

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

#A3C9DC

Sky Blue · LightSteelBlue · Cobalt Blue

HEX
#A3C9DC
RGB
rgb(163, 201, 220)
HSL
hsl(200, 45%, 75%)
HSB
hsb(200, 26%, 86%)
CMYK
cmyk(26%, 9%, 0%, 14%)
Oklch
oklch(81.5% 0.048 229.7)

Traditional「Sky Blue」· Paint「Cobalt Blue」· Creative Twilight Haze

#3F2F4C

Dark Plum · DarkSlateGray · Eggplant

HEX
#3F2F4C
RGB
rgb(63, 47, 76)
HSL
hsl(273, 24%, 24%)
HSB
hsb(273, 38%, 30%)
CMYK
cmyk(17%, 38%, 0%, 70%)
Oklch
oklch(33.6% 0.054 309.0)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#2D1C3E

Dark Plum · DarkSlateGray · Dark Purple

HEX
#2D1C3E
RGB
rgb(45, 28, 62)
HSL
hsl(270, 38%, 18%)
HSB
hsb(270, 55%, 24%)
CMYK
cmyk(27%, 55%, 0%, 76%)
Oklch
oklch(26.6% 0.064 305.5)

Traditional「Dark Plum」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B3C095
A296C0

Analogous

C0B796
B3C095
9EC096

Triadic

B3C095
96B3C0
C096B3

Split-Comp.

B3C095
969EC0
B796C0

Tetradic

B3C095
96C0B7
A296C0
C0969E

Contrast Matrix WCAG 2.1 Contrast

B3C095
93A688
A3C9DC
3F2F4C
2D1C3E
—
1.4
Fail
1.1
Fail
6.3
AA
8.1
AAA
1.4
Fail
—
1.5
Fail
4.7
AA
6.0
AA
1.1
Fail
1.5
Fail
—
6.9
AA
8.9
AAA
6.3
AA
4.7
AA
6.9
AA
—
1.3
Fail
8.1
AAA
6.0
AA
8.9
AAA
1.3
Fail
—
White BG
1.9Fail
2.6Fail
1.8Fail
12.2AAA
15.6AAA
Black BG
10.9AAA
8.1AAA
11.9AAA
1.7Fail
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B9B99F
9B9B8F
B3B4D7
383845
262536

Deuteranopia

B8B7A2
9A9991
B1AED6
393A43
272834

Tritanopia

B4A8A9
949596
A5D4D3
3E3F3E
2C2F2E

Achromatopsia

B7B7B7
9D9D9D
C0C0C0
373737
252525

Shades & Tints Shades & Tints

#B3C095

Dark
Light

#93A688

Dark
Light

#A3C9DC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b3c095;
  --color-2: #93a688;
  --color-3: #a3c9dc;
  --color-4: #3f2f4c;
  --color-5: #2d1c3e;
}

SCSS

$color-1: #b3c095;
$color-2: #93a688;
$color-3: #a3c9dc;
$color-4: #3f2f4c;
$color-5: #2d1c3e;

TAILWIND

colors: {
  'brand-1': '#b3c095',
  'brand-2': '#93a688',
  'brand-3': '#a3c9dc',
  'brand-4': '#3f2f4c',
  'brand-5': '#2d1c3e',
}

RGB Array

[179, 192, 149], [147, 166, 136], [163, 201, 220], [63, 47, 76], [45, 28, 62]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B3C095, #93A688, #A3C9DC, #3F2F4C, #2D1C3E is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #b3c095; --color-2: #93a688; --color-3: #a3c9dc; --color-4: #3f2f4c; --color-5: #2d1c3e. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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. Restrained colors convey professionalism and trust. 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