← Back to Editor

#BB8972 · #9C415F · #752D43 · #481C34 · #7BC89C

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

#BB8972

Tangerine · DarkSalmon · Warm Sun

HEX
#BB8972
RGB
rgb(187, 137, 114)
HSL
hsl(19, 35%, 59%)
HSB
hsb(19, 39%, 73%)
CMYK
cmyk(0%, 27%, 39%, 27%)
Oklch
oklch(67.3% 0.070 45.7)

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

#9C415F

Dark Violet · Sienna · Camellia

HEX
#9C415F
RGB
rgb(156, 65, 95)
HSL
hsl(340, 41%, 43%)
HSB
hsb(340, 58%, 61%)
CMYK
cmyk(0%, 58%, 39%, 39%)
Oklch
oklch(50.5% 0.125 2.0)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#752D43

Dark Violet · Brown · Camellia

HEX
#752D43
RGB
rgb(117, 45, 67)
HSL
hsl(342, 44%, 32%)
HSB
hsb(342, 62%, 46%)
CMYK
cmyk(0%, 62%, 43%, 54%)
Oklch
oklch(40.6% 0.103 3.8)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#481C34

Rose Purple · DarkSlateGray · Raspberry

HEX
#481C34
RGB
rgb(72, 28, 52)
HSL
hsl(327, 44%, 20%)
HSB
hsb(327, 61%, 28%)
CMYK
cmyk(0%, 61%, 28%, 72%)
Oklch
oklch(30.0% 0.074 348.6)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

#7BC89C

Celadon · MediumAquaMarine · Apple Green

HEX
#7BC89C
RGB
rgb(123, 200, 156)
HSL
hsl(146, 41%, 63%)
HSB
hsb(146, 39%, 78%)
CMYK
cmyk(38%, 0%, 22%, 22%)
Oklch
oklch(77.1% 0.100 157.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BB8972
72A4BB

Analogous

BB727F
BB8972
BBAE72

Triadic

BB8972
72BB89
8972BB

Split-Comp.

BB8972
72BBAE
727FBB

Tetradic

BB8972
7FBB72
72A4BB
AE72BB

Contrast Matrix WCAG 2.1 Contrast

BB8972
9C415F
752D43
481C34
7BC89C
—
2.1
Fail
3.1
AA Large
4.6
AA
1.5
Fail
2.1
Fail
—
1.5
Fail
2.2
Fail
3.2
AA Large
3.1
AA Large
1.5
Fail
—
1.5
Fail
4.8
AA
4.6
AA
2.2
Fail
1.5
Fail
—
7.1
AAA
1.5
Fail
3.2
AA Large
4.8
AA
7.1
AAA
—
White BG
3.0AA Large
6.3AA
9.5AAA
14.1AAA
2.0Fail
Black BG
6.9AA
3.3AA Large
2.2Fail
1.5Fail
10.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A5A578
757458
56553E
35352E
9C9DA7

Deuteranopia

A8AC79
7A8156
5A5F3C
383B2D
9892A9

Tritanopia

B97C7D
975251
713939
462A29
7FAFB1

Achromatopsia

959595
606060
454545
2C2C2C
ACACAC

Shades & Tints Shades & Tints

#BB8972

Dark
Light

#9C415F

Dark
Light

#752D43

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bb8972;
  --color-2: #9c415f;
  --color-3: #752d43;
  --color-4: #481c34;
  --color-5: #7bc89c;
}

SCSS

$color-1: #bb8972;
$color-2: #9c415f;
$color-3: #752d43;
$color-4: #481c34;
$color-5: #7bc89c;

TAILWIND

colors: {
  'brand-1': '#bb8972',
  'brand-2': '#9c415f',
  'brand-3': '#752d43',
  'brand-4': '#481c34',
  'brand-5': '#7bc89c',
}

RGB Array

[187, 137, 114], [156, 65, 95], [117, 45, 67], [72, 28, 52], [123, 200, 156]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BB8972, #9C415F, #752D43, #481C34, #7BC89C 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: #bb8972; --color-2: #9c415f; --color-3: #752d43; --color-4: #481c34; --color-5: #7bc89c. 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