#787664 + #4D6E6B + #824F69 + #CC2759 + #691759 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#787664

Autumn Sage · DimGray · Warm Gray

HEX

#787664

RGB

rgb(120, 118, 100)

HSL

hsl(54, 9%, 43%)

HSB

hsb(54, 17%, 47%)

CMYK

cmyk(0%, 2%, 17%, 53%)

Oklch

oklch(56.2% 0.027 102.0)

Traditional「Autumn Sage」· Paint「Warm Gray」· Creative Urban Concrete

#4D6E6B

Mineral Blue · DimGray · Mint Ice

HEX

#4D6E6B

RGB

rgb(77, 110, 107)

HSL

hsl(175, 18%, 37%)

HSB

hsb(175, 30%, 43%)

CMYK

cmyk(30%, 0%, 3%, 57%)

Oklch

oklch(51.2% 0.038 189.0)

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

#824F69

Rose Purple · DimGray · Camellia

HEX

#824F69

RGB

rgb(130, 79, 105)

HSL

hsl(329, 24%, 41%)

HSB

hsb(329, 39%, 51%)

CMYK

cmyk(0%, 39%, 19%, 49%)

Oklch

oklch(49.4% 0.077 348.4)

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

#CC2759

Dark Violet · Crimson · Camellia

HEX

#CC2759

RGB

rgb(204, 39, 89)

HSL

hsl(342, 68%, 48%)

HSB

hsb(342, 81%, 80%)

CMYK

cmyk(0%, 81%, 56%, 20%)

Oklch

oklch(55.7% 0.199 9.8)

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

#691759

Rose Purple · Purple · Eggplant

HEX

#691759

RGB

rgb(105, 23, 89)

HSL

hsl(312, 64%, 25%)

HSB

hsb(312, 78%, 41%)

CMYK

cmyk(0%, 78%, 15%, 59%)

Oklch

oklch(37.0% 0.137 337.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

787664

646678

Analogous

786C64

787664

707864

Triadic

787664

647876

766478

Split-Comp.

787664

647078

6C6478

Tetradic

787664

64786C

646678

786470

Contrast Matrix WCAG 2.1 Contrast

787664	4D6E6B	824F69	CC2759	691759
—	1.2 Fail	1.4 Fail	1.1 Fail	2.4 Fail
1.2 Fail	—	1.1 Fail	1.1 Fail	2.0 Fail
1.4 Fail	1.1 Fail	—	1.2 Fail	1.8 Fail
1.1 Fail	1.1 Fail	1.2 Fail	—	2.1 Fail
2.4 Fail	2.0 Fail	1.8 Fail	2.1 Fail	—

White BG

4.6AA

5.6AA

6.4AA

5.2AA

11.2AAA

Black BG

4.6AA

3.8AA Large

3.3AA Large

4.0AA Large

1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

777768

5B5C6C

6C6B63

85834D

454549

Deuteranopia

777769

59576C

6F7361

8E9A4A

4A5045

Tritanopia

786C6D

4F6C6C

7F5E5D

C44341

653C3A

Achromatopsia

757575

646464

616161

5E5E5E

373737

Shades & Tints Shades & Tints

#787664

Dark

Light

#4D6E6B

Dark

Light

#824F69

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #787664;
  --color-2: #4d6e6b;
  --color-3: #824f69;
  --color-4: #cc2759;
  --color-5: #691759;
}

SCSS

$color-1: #787664;
$color-2: #4d6e6b;
$color-3: #824f69;
$color-4: #cc2759;
$color-5: #691759;

TAILWIND

colors: {
  'brand-1': '#787664',
  'brand-2': '#4d6e6b',
  'brand-3': '#824f69',
  'brand-4': '#cc2759',
  'brand-5': '#691759',
}

RGB Array

[120, 118, 100], [77, 110, 107], [130, 79, 105], [204, 39, 89], [105, 23, 89]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #787664, #4D6E6B, #824F69, #CC2759, #691759 is ideal for: tech websites, dark mode UIs, game UIs. 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: #787664; --color-2: #4d6e6b; --color-3: #824f69; --color-4: #cc2759; --color-5: #691759. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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