← Back to Editor

#A7C8BD · #EFF4B7 · #A19D8C · #696658 · #B8735E

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 LibraryData Visualization

Color Details Color Details

#A7C8BD

Jade · Silver · Lake Green

HEX
#A7C8BD
RGB
rgb(167, 200, 189)
HSL
hsl(160, 23%, 72%)
HSB
hsb(160, 16%, 78%)
CMYK
cmyk(16%, 0%, 5%, 22%)
Oklch
oklch(80.5% 0.039 173.1)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#EFF4B7

Fresh Green · Wheat · Lemon Cream

HEX
#EFF4B7
RGB
rgb(239, 244, 183)
HSL
hsl(65, 73%, 84%)
HSB
hsb(65, 25%, 96%)
CMYK
cmyk(2%, 0%, 25%, 4%)
Oklch
oklch(94.9% 0.079 111.7)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#A19D8C

Ginger · DarkGray · Sunflower

HEX
#A19D8C
RGB
rgb(161, 157, 140)
HSL
hsl(49, 10%, 59%)
HSB
hsb(49, 13%, 63%)
CMYK
cmyk(0%, 2%, 13%, 37%)
Oklch
oklch(69.5% 0.025 96.1)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#696658

Ochre · DimGray · Charcoal

HEX
#696658
RGB
rgb(105, 102, 88)
HSL
hsl(49, 9%, 38%)
HSB
hsb(49, 16%, 41%)
CMYK
cmyk(0%, 3%, 16%, 59%)
Oklch
oklch(50.9% 0.022 97.1)

Traditional「Ochre」· Paint「Charcoal」· Creative Midnight Shadow

#B8735E

Crimson · Sienna · Passion Red

HEX
#B8735E
RGB
rgb(184, 115, 94)
HSL
hsl(14, 39%, 55%)
HSB
hsb(14, 49%, 72%)
CMYK
cmyk(0%, 38%, 49%, 28%)
Oklch
oklch(62.4% 0.093 37.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A7C8BD
C8A7B2

Analogous

A7C8AD
A7C8BD
A7C3C8

Triadic

A7C8BD
BDA7C8
C8BDA7

Split-Comp.

A7C8BD
C8A7C3
C8ADA7

Tetradic

A7C8BD
ADA7C8
C8A7B2
C3C8A7

Contrast Matrix WCAG 2.1 Contrast

A7C8BD
EFF4B7
A19D8C
696658
B8735E
—
1.6
Fail
1.5
Fail
3.2
AA Large
2.1
Fail
1.6
Fail
—
2.4
Fail
5.0
AA
3.2
AA Large
1.5
Fail
2.4
Fail
—
2.1
Fail
1.4
Fail
3.2
AA Large
5.0
AA
2.1
Fail
—
1.6
Fail
2.1
Fail
3.2
AA Large
1.4
Fail
1.6
Fail
—
White BG
1.8Fail
1.1Fail
2.7Fail
5.8AA
3.7AA Large
Black BG
11.6AAA
18.3AAA
7.7AAA
3.6AA Large
5.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B5B6C0
F1F1C6
9F9F90
68685B
9A9A63

Deuteranopia

B3B1C0
F1F1C9
A0A091
68685C
9EA364

Tritanopia

A9C2C2
EFD1D4
A19394
695E5F
B56768

Achromatopsia

BDBDBD
ECECEC
9C9C9C
656565
858585

Shades & Tints Shades & Tints

#A7C8BD

Dark
Light

#EFF4B7

Dark
Light

#A19D8C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a7c8bd;
  --color-2: #eff4b7;
  --color-3: #a19d8c;
  --color-4: #696658;
  --color-5: #b8735e;
}

SCSS

$color-1: #a7c8bd;
$color-2: #eff4b7;
$color-3: #a19d8c;
$color-4: #696658;
$color-5: #b8735e;

TAILWIND

colors: {
  'brand-1': '#a7c8bd',
  'brand-2': '#eff4b7',
  'brand-3': '#a19d8c',
  'brand-4': '#696658',
  'brand-5': '#b8735e',
}

RGB Array

[167, 200, 189], [239, 244, 183], [161, 157, 140], [105, 102, 88], [184, 115, 94]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A7C8BD, #EFF4B7, #A19D8C, #696658, #B8735E is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #a7c8bd; --color-2: #eff4b7; --color-3: #a19d8c; --color-4: #696658; --color-5: #b8735e. 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. 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 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