#7EA793 + #88937F + #4D3027 + #834439 + #A84936 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#7EA793

Mineral Blue · DarkSeaGreen · Olive Green

HEX

#7EA793

RGB

rgb(126, 167, 147)

HSL

hsl(151, 19%, 57%)

HSB

hsb(151, 25%, 65%)

CMYK

cmyk(25%, 0%, 12%, 35%)

Oklch

oklch(69.3% 0.053 163.5)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#88937F

Celadon · Gray · Warm Gray

HEX

#88937F

RGB

rgb(136, 147, 127)

HSL

hsl(93, 8%, 54%)

HSB

hsb(93, 14%, 58%)

CMYK

cmyk(7%, 0%, 14%, 42%)

Oklch

oklch(64.9% 0.032 130.9)

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

#4D3027

Crimson · DarkSlateGray · Wine Red

HEX

#4D3027

RGB

rgb(77, 48, 39)

HSL

hsl(14, 33%, 23%)

HSB

hsb(14, 49%, 30%)

CMYK

cmyk(0%, 38%, 49%, 70%)

Oklch

oklch(34.2% 0.046 38.0)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#834439

Crimson · Sienna · Wine Red

HEX

#834439

RGB

rgb(131, 68, 57)

HSL

hsl(9, 39%, 37%)

HSB

hsb(9, 56%, 51%)

CMYK

cmyk(0%, 48%, 56%, 49%)

Oklch

oklch(46.2% 0.089 31.1)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#A84936

Crimson · Sienna · Passion Red

HEX

#A84936

RGB

rgb(168, 73, 54)

HSL

hsl(10, 51%, 44%)

HSB

hsb(10, 68%, 66%)

CMYK

cmyk(0%, 57%, 68%, 34%)

Oklch

oklch(52.6% 0.130 33.0)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7EA793

A67D91

Analogous

7DA67D

7EA793

7DA5A6

Triadic

7EA793

927DA6

A6927D

Split-Comp.

7EA793

A67DA5

A67D7D

Tetradic

7EA793

7D7DA6

A67D91

A5A67D

Contrast Matrix WCAG 2.1 Contrast

7EA793	88937F	4D3027	834439	A84936
—	1.2 Fail	4.4 AA Large	2.7 Fail	2.1 Fail
1.2 Fail	—	3.7 AA Large	2.3 Fail	1.8 Fail
4.4 AA Large	3.7 AA Large	—	1.6 Fail	2.1 Fail
2.7 Fail	2.3 Fail	1.6 Fail	—	1.3 Fail
2.1 Fail	1.8 Fail	2.1 Fail	1.3 Fail	—

White BG

2.7Fail

3.2AA Large

11.9AAA

7.4AAA

5.7AA

Black BG

7.8AAA

6.5AA

1.8Fail

2.9Fail

3.7AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

909098

8D8D84

404029

68673C

7F7E3B

Deuteranopia

8D8A99

8C8B85

42442A

6B703C

848C3C

Tritanopia

809C9D

898889

4C2B2B

803E3E

A33E3F

Achromatopsia

989898

8D8D8D

383838

565656

636363

Shades & Tints Shades & Tints

#7EA793

Dark

Light

#88937F

Dark

Light

#4D3027

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7ea793;
  --color-2: #88937f;
  --color-3: #4d3027;
  --color-4: #834439;
  --color-5: #a84936;
}

SCSS

$color-1: #7ea793;
$color-2: #88937f;
$color-3: #4d3027;
$color-4: #834439;
$color-5: #a84936;

TAILWIND

colors: {
  'brand-1': '#7ea793',
  'brand-2': '#88937f',
  'brand-3': '#4d3027',
  'brand-4': '#834439',
  'brand-5': '#a84936',
}

RGB Array

[126, 167, 147], [136, 147, 127], [77, 48, 39], [131, 68, 57], [168, 73, 54]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #7EA793, #88937F, #4D3027, #834439, #A84936 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: #7ea793; --color-2: #88937f; --color-3: #4d3027; --color-4: #834439; --color-5: #a84936. 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 cool-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