← Back to Editor

#C38664 · #C39F62 · #B8B363 · #B7BE9A · #87A79E

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

#C38664

Tangerine · DarkSalmon · Warm Sun

HEX
#C38664
RGB
rgb(195, 134, 100)
HSL
hsl(21, 44%, 58%)
HSB
hsb(21, 49%, 76%)
CMYK
cmyk(0%, 31%, 49%, 24%)
Oklch
oklch(67.4% 0.089 49.9)

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

#C39F62

Ginger · DarkSalmon · Warm Sun

HEX
#C39F62
RGB
rgb(195, 159, 98)
HSL
hsl(38, 45%, 57%)
HSB
hsb(38, 50%, 76%)
CMYK
cmyk(0%, 18%, 50%, 24%)
Oklch
oklch(72.2% 0.090 79.8)

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

#B8B363

Autumn Sage · Tan · Sunflower

HEX
#B8B363
RGB
rgb(184, 179, 99)
HSL
hsl(56, 37%, 55%)
HSB
hsb(56, 46%, 72%)
CMYK
cmyk(0%, 3%, 46%, 28%)
Oklch
oklch(75.3% 0.103 105.4)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#B7BE9A

Willow Green · DarkGray · Apple Green

HEX
#B7BE9A
RGB
rgb(183, 190, 154)
HSL
hsl(72, 22%, 67%)
HSB
hsb(72, 19%, 75%)
CMYK
cmyk(4%, 0%, 19%, 25%)
Oklch
oklch(78.6% 0.050 116.5)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#87A79E

Mineral Blue · DarkSeaGreen · Lake Green

HEX
#87A79E
RGB
rgb(135, 167, 158)
HSL
hsl(163, 15%, 59%)
HSB
hsb(163, 19%, 65%)
CMYK
cmyk(19%, 0%, 5%, 35%)
Oklch
oklch(70.2% 0.038 176.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C38664
65A2C3

Analogous

C36573
C38664
C3B565

Triadic

C38664
65C386
8665C3

Split-Comp.

C38664
65C3B5
6573C3

Tetradic

C38664
73C365
65A2C3
B565C3

Contrast Matrix WCAG 2.1 Contrast

C38664
C39F62
B8B363
B7BE9A
87A79E
—
1.2
Fail
1.4
Fail
1.6
Fail
1.2
Fail
1.2
Fail
—
1.1
Fail
1.3
Fail
1.1
Fail
1.4
Fail
1.1
Fail
—
1.1
Fail
1.2
Fail
1.6
Fail
1.3
Fail
1.1
Fail
—
1.3
Fail
1.2
Fail
1.1
Fail
1.2
Fail
1.3
Fail
—
White BG
3.0AA Large
2.5Fail
2.2Fail
1.9Fail
2.6Fail
Black BG
6.9AA
8.5AAA
9.7AAA
10.8AAA
8.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A9A86C
B3B371
B6B676
BABAA3
9595A0

Deuteranopia

ACB16E
B6B874
B6B67B
BAB9A5
9391A1

Tritanopia

C07374
C17C7F
B88689
B7AAAB
89A2A2

Achromatopsia

949494
A3A3A3
ABABAB
B8B8B8
9C9C9C

Shades & Tints Shades & Tints

#C38664

Dark
Light

#C39F62

Dark
Light

#B8B363

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c38664;
  --color-2: #c39f62;
  --color-3: #b8b363;
  --color-4: #b7be9a;
  --color-5: #87a79e;
}

SCSS

$color-1: #c38664;
$color-2: #c39f62;
$color-3: #b8b363;
$color-4: #b7be9a;
$color-5: #87a79e;

TAILWIND

colors: {
  'brand-1': '#c38664',
  'brand-2': '#c39f62',
  'brand-3': '#b8b363',
  'brand-4': '#b7be9a',
  'brand-5': '#87a79e',
}

RGB Array

[195, 134, 100], [195, 159, 98], [184, 179, 99], [183, 190, 154], [135, 167, 158]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C38664, #C39F62, #B8B363, #B7BE9A, #87A79E 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: #c38664; --color-2: #c39f62; --color-3: #b8b363; --color-4: #b7be9a; --color-5: #87a79e. 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