← Back to Editor

#765466 · #818784 · #8FBA9E · #BDCE9C · #E3D98C

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#765466

Rose Purple · DimGray · Camellia

HEX
#765466
RGB
rgb(118, 84, 102)
HSL
hsl(328, 17%, 40%)
HSB
hsb(328, 29%, 46%)
CMYK
cmyk(0%, 29%, 14%, 54%)
Oklch
oklch(48.8% 0.052 346.2)

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

#818784

Ash · Gray · Warm Gray

HEX
#818784
RGB
rgb(129, 135, 132)
HSL
hsl(150, 2%, 52%)
HSB
hsb(150, 4%, 53%)
CMYK
cmyk(4%, 0%, 2%, 47%)
Oklch
oklch(61.7% 0.008 164.8)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

#8FBA9E

Celadon · DarkSeaGreen · Apple Green

HEX
#8FBA9E
RGB
rgb(143, 186, 158)
HSL
hsl(141, 24%, 65%)
HSB
hsb(141, 23%, 73%)
CMYK
cmyk(23%, 0%, 15%, 27%)
Oklch
oklch(75.0% 0.061 156.1)

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

#BDCE9C

Willow Green · Tan · Apple Green

HEX
#BDCE9C
RGB
rgb(189, 206, 156)
HSL
hsl(80, 34%, 71%)
HSB
hsb(80, 24%, 81%)
CMYK
cmyk(8%, 0%, 24%, 19%)
Oklch
oklch(82.6% 0.070 123.2)

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

#E3D98C

Fresh Green · Khaki · Sunflower

HEX
#E3D98C
RGB
rgb(227, 217, 140)
HSL
hsl(53, 61%, 72%)
HSB
hsb(53, 38%, 89%)
CMYK
cmyk(0%, 4%, 38%, 11%)
Oklch
oklch(87.6% 0.098 101.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

765466
557765

Analogous

765577
765466
775556

Triadic

765466
677755
556777

Split-Comp.

765466
567755
557776

Tetradic

765466
777655
557765
555677

Contrast Matrix WCAG 2.1 Contrast

765466
818784
8FBA9E
BDCE9C
E3D98C
—
1.8
Fail
3.0
Fail
3.9
AA Large
4.5
AA
1.8
Fail
—
1.7
Fail
2.2
Fail
2.5
Fail
3.0
Fail
1.7
Fail
—
1.3
Fail
1.5
Fail
3.9
AA Large
2.2
Fail
1.3
Fail
—
1.2
Fail
4.5
AA
2.5
Fail
1.5
Fail
1.2
Fail
—
White BG
6.5AA
3.7AA Large
2.2Fail
1.7Fail
1.4Fail
Black BG
3.2AA Large
5.7AA
9.7AAA
12.5AAA
14.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

676762
848485
A2A2A5
C4C5A8
DFDF9F

Deuteranopia

696C61
838385
9F9CA6
C3C2AB
DFE0A3

Tritanopia

745E5D
818585
91AAAB
BEB2B4
E2ADB1

Achromatopsia

606060
858585
AAAAAA
C3C3C3
D3D3D3

Shades & Tints Shades & Tints

#765466

Dark
Light

#818784

Dark
Light

#8FBA9E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #765466;
  --color-2: #818784;
  --color-3: #8fba9e;
  --color-4: #bdce9c;
  --color-5: #e3d98c;
}

SCSS

$color-1: #765466;
$color-2: #818784;
$color-3: #8fba9e;
$color-4: #bdce9c;
$color-5: #e3d98c;

TAILWIND

colors: {
  'brand-1': '#765466',
  'brand-2': '#818784',
  'brand-3': '#8fba9e',
  'brand-4': '#bdce9c',
  'brand-5': '#e3d98c',
}

RGB Array

[118, 84, 102], [129, 135, 132], [143, 186, 158], [189, 206, 156], [227, 217, 140]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #765466, #818784, #8FBA9E, #BDCE9C, #E3D98C is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. 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: #765466; --color-2: #818784; --color-3: #8fba9e; --color-4: #bdce9c; --color-5: #e3d98c. 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. 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