← Back to Editor

#CFB091 · #C39F89 · #BB8875 · #977961 · #796E58

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#CFB091

Ginger · Tan · Warm Sun

HEX
#CFB091
RGB
rgb(207, 176, 145)
HSL
hsl(30, 39%, 69%)
HSB
hsb(30, 30%, 81%)
CMYK
cmyk(0%, 15%, 30%, 19%)
Oklch
oklch(77.6% 0.056 66.9)

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

#C39F89

Apricot · Tan · Warm Sun

HEX
#C39F89
RGB
rgb(195, 159, 137)
HSL
hsl(23, 33%, 65%)
HSB
hsb(23, 30%, 76%)
CMYK
cmyk(0%, 18%, 30%, 24%)
Oklch
oklch(72.9% 0.053 53.1)

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

#BB8875

Tangerine · DarkSalmon · Warm Sun

HEX
#BB8875
RGB
rgb(187, 136, 117)
HSL
hsl(16, 34%, 60%)
HSB
hsb(16, 37%, 73%)
CMYK
cmyk(0%, 27%, 37%, 27%)
Oklch
oklch(67.2% 0.069 41.3)

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

#977961

Tangerine · Gray · Amber Brown

HEX
#977961
RGB
rgb(151, 121, 97)
HSL
hsl(27, 22%, 49%)
HSB
hsb(27, 36%, 59%)
CMYK
cmyk(0%, 20%, 36%, 41%)
Oklch
oklch(59.9% 0.051 60.3)

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

#796E58

Ochre · DimGray · Honey Gold

HEX
#796E58
RGB
rgb(121, 110, 88)
HSL
hsl(40, 16%, 41%)
HSB
hsb(40, 27%, 47%)
CMYK
cmyk(0%, 9%, 27%, 53%)
Oklch
oklch(54.2% 0.035 84.5)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CFB091
91B0CF

Analogous

CF9191
CFB091
CFCF91

Triadic

CFB091
91CFB0
B091CF

Split-Comp.

CFB091
91CFCF
9191CF

Tetradic

CFB091
91CF91
91B0CF
CF91CF

Contrast Matrix WCAG 2.1 Contrast

CFB091
C39F89
BB8875
977961
796E58
—
1.2
Fail
1.5
Fail
2.0
Fail
2.5
Fail
1.2
Fail
—
1.3
Fail
1.7
Fail
2.1
Fail
1.5
Fail
1.3
Fail
—
1.3
Fail
1.6
Fail
2.0
Fail
1.7
Fail
1.3
Fail
—
1.2
Fail
2.5
Fail
2.1
Fail
1.6
Fail
1.2
Fail
—
White BG
2.0Fail
2.4Fail
3.0AA Large
4.0AA Large
5.0AA
Black BG
10.3AAA
8.6AAA
6.9AA
5.2AA
4.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

C2C199
B3B38E
A5A47A
8A8A67
74745D

Deuteranopia

C3C69A
B6B890
A8AC7B
8C8E68
75765F

Tritanopia

CD9EA0
C19393
B87D7E
966B6C
786262

Achromatopsia

B6B6B6
A7A7A7
959595
7F7F7F
6F6F6F

Shades & Tints Shades & Tints

#CFB091

Dark
Light

#C39F89

Dark
Light

#BB8875

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cfb091;
  --color-2: #c39f89;
  --color-3: #bb8875;
  --color-4: #977961;
  --color-5: #796e58;
}

SCSS

$color-1: #cfb091;
$color-2: #c39f89;
$color-3: #bb8875;
$color-4: #977961;
$color-5: #796e58;

TAILWIND

colors: {
  'brand-1': '#cfb091',
  'brand-2': '#c39f89',
  'brand-3': '#bb8875',
  'brand-4': '#977961',
  'brand-5': '#796e58',
}

RGB Array

[207, 176, 145], [195, 159, 137], [187, 136, 117], [151, 121, 97], [121, 110, 88]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CFB091, #C39F89, #BB8875, #977961, #796E58 is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. 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: #cfb091; --color-2: #c39f89; --color-3: #bb8875; --color-4: #977961; --color-5: #796e58. 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. 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