← Back to Editor

#7FA095 · #ABA597 · #DDAD96 · #B08359 · #7C5834

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#7FA095

Mineral Blue · LightSlateGray · Lake Green

HEX
#7FA095
RGB
rgb(127, 160, 149)
HSL
hsl(160, 15%, 56%)
HSB
hsb(160, 21%, 63%)
CMYK
cmyk(21%, 0%, 7%, 37%)
Oklch
oklch(67.8% 0.040 172.7)

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

#ABA597

Ginger · DarkGray · Sunflower

HEX
#ABA597
RGB
rgb(171, 165, 151)
HSL
hsl(42, 11%, 63%)
HSB
hsb(42, 12%, 67%)
CMYK
cmyk(0%, 4%, 12%, 33%)
Oklch
oklch(72.3% 0.021 87.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#DDAD96

Apricot · Tan · Warm Sun

HEX
#DDAD96
RGB
rgb(221, 173, 150)
HSL
hsl(19, 51%, 73%)
HSB
hsb(19, 32%, 87%)
CMYK
cmyk(0%, 22%, 32%, 13%)
Oklch
oklch(78.5% 0.065 46.9)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#B08359

Tangerine · Gray · Warm Sun

HEX
#B08359
RGB
rgb(176, 131, 89)
HSL
hsl(29, 36%, 52%)
HSB
hsb(29, 49%, 69%)
CMYK
cmyk(0%, 26%, 49%, 31%)
Oklch
oklch(64.4% 0.080 63.7)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#7C5834

Ochre · Sienna · Amber Brown

HEX
#7C5834
RGB
rgb(124, 88, 52)
HSL
hsl(30, 41%, 35%)
HSB
hsb(30, 58%, 49%)
CMYK
cmyk(0%, 29%, 58%, 51%)
Oklch
oklch(49.0% 0.070 64.9)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7FA095
A07E89

Analogous

7EA084
7FA095
7E9AA0

Triadic

7FA095
947EA0
A0947E

Split-Comp.

7FA095
A07E9A
A0847E

Tetradic

7FA095
847EA0
A07E89
9AA07E

Contrast Matrix WCAG 2.1 Contrast

7FA095
ABA597
DDAD96
B08359
7C5834
—
1.2
Fail
1.4
Fail
1.2
Fail
2.2
Fail
1.2
Fail
—
1.2
Fail
1.4
Fail
2.6
Fail
1.4
Fail
1.2
Fail
—
1.7
Fail
3.2
AA Large
1.2
Fail
1.4
Fail
1.7
Fail
—
1.9
Fail
2.2
Fail
2.6
Fail
3.2
AA Large
1.9
Fail
—
White BG
2.9Fail
2.5Fail
2.0Fail
3.4AA Large
6.4AA
Black BG
7.4AAA
8.6AAA
10.5AAA
6.2AA
3.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

8D8E98
A8A89A
C8C89C
9D9C63
6C6C3D

Deuteranopia

8B8998
A9A99B
CBCF9D
9FA366
6F713F

Tritanopia

819A9A
AB9D9E
DBA0A1
AE6B6D
7A4445

Achromatopsia

959595
A5A5A5
B9B9B9
8C8C8C
5F5F5F

Shades & Tints Shades & Tints

#7FA095

Dark
Light

#ABA597

Dark
Light

#DDAD96

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7fa095;
  --color-2: #aba597;
  --color-3: #ddad96;
  --color-4: #b08359;
  --color-5: #7c5834;
}

SCSS

$color-1: #7fa095;
$color-2: #aba597;
$color-3: #ddad96;
$color-4: #b08359;
$color-5: #7c5834;

TAILWIND

colors: {
  'brand-1': '#7fa095',
  'brand-2': '#aba597',
  'brand-3': '#ddad96',
  'brand-4': '#b08359',
  'brand-5': '#7c5834',
}

RGB Array

[127, 160, 149], [171, 165, 151], [221, 173, 150], [176, 131, 89], [124, 88, 52]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7FA095, #ABA597, #DDAD96, #B08359, #7C5834 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: #7fa095; --color-2: #aba597; --color-3: #ddad96; --color-4: #b08359; --color-5: #7c5834. 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