#654A6A + #91466C + #808A53 + #62B960 + #14B9B2 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#654A6A

Dark Plum · DimGray · Eggplant

HEX

#654A6A

RGB

rgb(101, 74, 106)

HSL

hsl(291, 18%, 35%)

HSB

hsb(291, 30%, 42%)

CMYK

cmyk(5%, 30%, 0%, 58%)

Oklch

oklch(45.0% 0.061 321.1)

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

#91466C

Dark Violet · DimGray · Camellia

HEX

#91466C

RGB

rgb(145, 70, 108)

HSL

hsl(330, 35%, 42%)

HSB

hsb(330, 52%, 57%)

CMYK

cmyk(0%, 52%, 26%, 43%)

Oklch

oklch(50.1% 0.111 350.2)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#808A53

Grass Green · DimGray · Olive Green

HEX

#808A53

RGB

rgb(128, 138, 83)

HSL

hsl(71, 25%, 43%)

HSB

hsb(71, 40%, 54%)

CMYK

cmyk(7%, 0%, 40%, 46%)

Oklch

oklch(61.2% 0.078 117.2)

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

#62B960

Celadon · MediumSeaGreen · Olive Green

HEX

#62B960

RGB

rgb(98, 185, 96)

HSL

hsl(119, 39%, 55%)

HSB

hsb(119, 48%, 73%)

CMYK

cmyk(47%, 0%, 48%, 27%)

Oklch

oklch(71.0% 0.151 143.4)

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

#14B9B2

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#14B9B2

RGB

rgb(20, 185, 178)

HSL

hsl(177, 80%, 40%)

HSB

hsb(177, 89%, 73%)

CMYK

cmyk(89%, 0%, 4%, 27%)

Oklch

oklch(71.0% 0.120 189.9)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

654A6A

4E6949

Analogous

544969

654A6A

69495E

Triadic

654A6A

696449

496964

Split-Comp.

654A6A

5E6949

496954

Tetradic

654A6A

695449

4E6949

495E69

Contrast Matrix WCAG 2.1 Contrast

654A6A	91466C	808A53	62B960	14B9B2
—	1.2 Fail	2.1 Fail	3.1 AA Large	3.1 AA Large
1.2 Fail	—	1.7 Fail	2.6 Fail	2.6 Fail
2.1 Fail	1.7 Fail	—	1.5 Fail	1.5 Fail
3.1 AA Large	2.6 Fail	1.5 Fail	—	1.0 Fail
3.1 AA Large	2.6 Fail	1.5 Fail	1.0 Fail	—

White BG

7.7AAA

6.4AA

3.7AA Large

2.4Fail

Black BG

2.7Fail

3.3AA Large

5.7AA

8.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

595962

717063

848460

888876

5B5DB4

Deuteranopia

5B5D60

757B61

848364

837C7B

5246B4

Tritanopia

645C5B

8D5C5A

816B6D

66878A

1CB5B5

Achromatopsia

565656

616161

818181

959595

878787

Shades & Tints Shades & Tints

#654A6A

Dark

Light

#91466C

Dark

Light

#808A53

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #654a6a;
  --color-2: #91466c;
  --color-3: #808a53;
  --color-4: #62b960;
  --color-5: #14b9b2;
}

SCSS

$color-1: #654a6a;
$color-2: #91466c;
$color-3: #808a53;
$color-4: #62b960;
$color-5: #14b9b2;

TAILWIND

colors: {
  'brand-1': '#654a6a',
  'brand-2': '#91466c',
  'brand-3': '#808a53',
  'brand-4': '#62b960',
  'brand-5': '#14b9b2',
}

RGB Array

[101, 74, 106], [145, 70, 108], [128, 138, 83], [98, 185, 96], [20, 185, 178]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #654A6A, #91466C, #808A53, #62B960, #14B9B2 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: #654a6a; --color-2: #91466c; --color-3: #808a53; --color-4: #62b960; --color-5: #14b9b2. 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