← Back to Editor

#7FA99F · #351F21 · #4A3B3E · #5E4C4C · #567F77

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarmCool

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporateData Visualization

Color Details Color Details

#7FA99F

Mineral Blue · DarkSeaGreen · Lake Green

HEX
#7FA99F
RGB
rgb(127, 169, 159)
HSL
hsl(166, 20%, 58%)
HSB
hsb(166, 25%, 66%)
CMYK
cmyk(25%, 0%, 6%, 34%)
Oklch
oklch(70.1% 0.048 178.6)

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

#351F21

Crimson · DarkSlateGray · Deep Berry

HEX
#351F21
RGB
rgb(53, 31, 33)
HSL
hsl(355, 26%, 16%)
HSB
hsb(355, 42%, 21%)
CMYK
cmyk(0%, 42%, 38%, 79%)
Oklch
oklch(26.9% 0.034 13.7)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#4A3B3E

Crimson · DarkSlateGray · Wine Red

HEX
#4A3B3E
RGB
rgb(74, 59, 62)
HSL
hsl(348, 11%, 26%)
HSB
hsb(348, 20%, 29%)
CMYK
cmyk(0%, 20%, 16%, 71%)
Oklch
oklch(36.9% 0.022 4.7)

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

#5E4C4C

Crimson · DimGray · Wine Red

HEX
#5E4C4C
RGB
rgb(94, 76, 76)
HSL
hsl(0, 11%, 33%)
HSB
hsb(0, 19%, 37%)
CMYK
cmyk(0%, 19%, 19%, 63%)
Oklch
oklch(43.5% 0.024 18.1)

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

#567F77

Mineral Blue · DimGray · Mint Ice

HEX
#567F77
RGB
rgb(86, 127, 119)
HSL
hsl(168, 19%, 42%)
HSB
hsb(168, 32%, 50%)
CMYK
cmyk(32%, 0%, 6%, 50%)
Oklch
oklch(56.4% 0.047 181.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7FA99F
A97E88

Analogous

7EA98A
7FA99F
7E9EA9

Triadic

7FA99F
9F7EA9
A99F7E

Split-Comp.

7FA99F
A97E9E
A98A7E

Tetradic

7FA99F
8A7EA9
A97E88
9EA97E

Contrast Matrix WCAG 2.1 Contrast

7FA99F
351F21
4A3B3E
5E4C4C
567F77
—
5.9
AA
4.1
AA Large
3.1
AA Large
1.7
Fail
5.9
AA
—
1.5
Fail
1.9
Fail
3.4
AA Large
4.1
AA Large
1.5
Fail
—
1.3
Fail
2.4
Fail
3.1
AA Large
1.9
Fail
1.3
Fail
—
1.8
Fail
1.7
Fail
3.4
AA Large
2.4
Fail
1.8
Fail
—
White BG
2.6Fail
15.3AAA
10.6AAA
8.0AAA
4.5AA Large
Black BG
8.1AAA
1.4Fail
2.0Fail
2.6Fail
4.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9192A1
2B2B21
44433D
56564C
686879

Deuteranopia

8F8CA2
2D2E20
44463D
57594C
656279

Tritanopia

81A3A4
342020
493D3D
5D4C4C
587A7B

Achromatopsia

9B9B9B
262626
404040
515151
727272

Shades & Tints Shades & Tints

#7FA99F

Dark
Light

#351F21

Dark
Light

#4A3B3E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7fa99f;
  --color-2: #351f21;
  --color-3: #4a3b3e;
  --color-4: #5e4c4c;
  --color-5: #567f77;
}

SCSS

$color-1: #7fa99f;
$color-2: #351f21;
$color-3: #4a3b3e;
$color-4: #5e4c4c;
$color-5: #567f77;

TAILWIND

colors: {
  'brand-1': '#7fa99f',
  'brand-2': '#351f21',
  'brand-3': '#4a3b3e',
  'brand-4': '#5e4c4c',
  'brand-5': '#567f77',
}

RGB Array

[127, 169, 159], [53, 31, 33], [74, 59, 62], [94, 76, 76], [86, 127, 119]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7FA99F, #351F21, #4A3B3E, #5E4C4C, #567F77 is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs, 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: #7fa99f; --color-2: #351f21; --color-3: #4a3b3e; --color-4: #5e4c4c; --color-5: #567f77. 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. 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 finance, legal, luxury 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