← Back to Editor

#8F5F4C · #763815 · #F7F6CC · #512608 · #BBA885

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

Color Details Color Details

#8F5F4C

Tangerine · Sienna · Amber Brown

HEX
#8F5F4C
RGB
rgb(143, 95, 76)
HSL
hsl(17, 31%, 43%)
HSB
hsb(17, 47%, 56%)
CMYK
cmyk(0%, 34%, 47%, 44%)
Oklch
oklch(53.2% 0.070 42.4)

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

#763815

Tangerine · Brown · Amber Brown

HEX
#763815
RGB
rgb(118, 56, 21)
HSL
hsl(22, 70%, 27%)
HSB
hsb(22, 82%, 46%)
CMYK
cmyk(0%, 53%, 82%, 54%)
Oklch
oklch(41.6% 0.099 46.9)

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

#F7F6CC

Fresh Green · Beige · Lemon Cream

HEX
#F7F6CC
RGB
rgb(247, 246, 204)
HSL
hsl(59, 73%, 88%)
HSB
hsb(59, 17%, 97%)
CMYK
cmyk(0%, 0%, 17%, 3%)
Oklch
oklch(96.3% 0.054 106.3)

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

#512608

Tangerine · Maroon · Cinnamon

HEX
#512608
RGB
rgb(81, 38, 8)
HSL
hsl(25, 82%, 17%)
HSB
hsb(25, 90%, 32%)
CMYK
cmyk(0%, 53%, 90%, 68%)
Oklch
oklch(32.3% 0.076 50.8)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#BBA885

Ginger · Tan · Warm Sun

HEX
#BBA885
RGB
rgb(187, 168, 133)
HSL
hsl(39, 28%, 63%)
HSB
hsb(39, 29%, 73%)
CMYK
cmyk(0%, 10%, 29%, 27%)
Oklch
oklch(73.9% 0.053 82.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8F5F4C
4C7C90

Analogous

904C5A
8F5F4C
90814C

Triadic

8F5F4C
4C905F
5F4C90

Split-Comp.

8F5F4C
4C9081
4C5A90

Tetradic

8F5F4C
5A904C
4C7C90
814C90

Contrast Matrix WCAG 2.1 Contrast

8F5F4C
763815
F7F6CC
512608
BBA885
—
1.7
Fail
4.9
AA
2.4
Fail
2.3
Fail
1.7
Fail
—
8.1
AAA
1.4
Fail
3.9
AA Large
4.9
AA
8.1
AAA
—
11.7
AAA
2.1
Fail
2.4
Fail
1.4
Fail
11.7
AAA
—
5.6
AA
2.3
Fail
3.9
AA Large
2.1
Fail
5.6
AA
—
White BG
5.4AA
8.9AAA
1.1Fail
12.9AAA
2.3Fail
Black BG
3.9AA Large
2.3Fail
19.0AAA
1.6Fail
9.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7A7A51
5B5B1D
F7F7D6
3E3E0F
B3B38D

Deuteranopia

7D8152
5F6320
F7F7D9
414411
B4B590

Tritanopia

8D5455
732426
F7DEE0
4F1516
BA9496

Achromatopsia

6B6B6B
474747
F2F2F2
2F2F2F
AAAAAA

Shades & Tints Shades & Tints

#8F5F4C

Dark
Light

#763815

Dark
Light

#F7F6CC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8f5f4c;
  --color-2: #763815;
  --color-3: #f7f6cc;
  --color-4: #512608;
  --color-5: #bba885;
}

SCSS

$color-1: #8f5f4c;
$color-2: #763815;
$color-3: #f7f6cc;
$color-4: #512608;
$color-5: #bba885;

TAILWIND

colors: {
  'brand-1': '#8f5f4c',
  'brand-2': '#763815',
  'brand-3': '#f7f6cc',
  'brand-4': '#512608',
  'brand-5': '#bba885',
}

RGB Array

[143, 95, 76], [118, 56, 21], [247, 246, 204], [81, 38, 8], [187, 168, 133]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8F5F4C, #763815, #F7F6CC, #512608, #BBA885 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: #8f5f4c; --color-2: #763815; --color-3: #f7f6cc; --color-4: #512608; --color-5: #bba885. 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