← Back to Editor

#BA7070 · #BA7A70 · #BAB370 · #BAB695 · #B8B6AD

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

#BA7070

Crimson · LightCoral · Passion Red

HEX
#BA7070
RGB
rgb(186, 112, 112)
HSL
hsl(0, 35%, 58%)
HSB
hsb(0, 40%, 73%)
CMYK
cmyk(0%, 40%, 40%, 27%)
Oklch
oklch(62.6% 0.094 20.1)

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

#BA7A70

Crimson · DarkSalmon · Passion Red

HEX
#BA7A70
RGB
rgb(186, 122, 112)
HSL
hsl(8, 35%, 58%)
HSB
hsb(8, 40%, 73%)
CMYK
cmyk(0%, 34%, 40%, 27%)
Oklch
oklch(64.3% 0.082 29.2)

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

#BAB370

Autumn Sage · Tan · Sunflower

HEX
#BAB370
RGB
rgb(186, 179, 112)
HSL
hsl(54, 35%, 58%)
HSB
hsb(54, 40%, 73%)
CMYK
cmyk(0%, 4%, 40%, 27%)
Oklch
oklch(75.7% 0.088 103.1)

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

#BAB695

Fresh Green · Tan · Sunflower

HEX
#BAB695
RGB
rgb(186, 182, 149)
HSL
hsl(54, 21%, 66%)
HSB
hsb(54, 20%, 73%)
CMYK
cmyk(0%, 2%, 20%, 27%)
Oklch
oklch(77.1% 0.045 101.7)

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

#B8B6AD

Ash · DarkGray · Silver Sand

HEX
#B8B6AD
RGB
rgb(184, 182, 173)
HSL
hsl(49, 7%, 70%)
HSB
hsb(49, 6%, 72%)
CMYK
cmyk(0%, 1%, 6%, 28%)
Oklch
oklch(77.5% 0.013 96.5)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BA7070
6EB9B9

Analogous

B96E94
BA7070
B9946E

Triadic

BA7070
6EB96E
6E6EB9

Split-Comp.

BA7070
6EB994
6E94B9

Tetradic

BA7070
94B96E
6EB9B9
946EB9

Contrast Matrix WCAG 2.1 Contrast

BA7070
BA7A70
BAB370
BAB695
B8B6AD
—
1.1
Fail
1.7
Fail
1.8
Fail
1.8
Fail
1.1
Fail
—
1.6
Fail
1.7
Fail
1.7
Fail
1.7
Fail
1.6
Fail
—
1.0
Fail
1.1
Fail
1.8
Fail
1.7
Fail
1.0
Fail
—
1.0
Fail
1.8
Fail
1.7
Fail
1.1
Fail
1.0
Fail
—
White BG
3.7AA Large
3.4AA Large
2.1Fail
2.1Fail
2.0Fail
Black BG
5.6AA
6.1AA
9.8AAA
10.2AAA
10.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9A9970
9E9E72
B7B780
B8B89D
B7B7AF

Deuteranopia

9EA470
A2A773
B7B884
B9B99F
B7B7B0

Tritanopia

B67070
B77475
BA8D90
BAA3A5
B8B1B1

Achromatopsia

868686
8C8C8C
ADADAD
B3B3B3
B6B6B6

Shades & Tints Shades & Tints

#BA7070

Dark
Light

#BA7A70

Dark
Light

#BAB370

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ba7070;
  --color-2: #ba7a70;
  --color-3: #bab370;
  --color-4: #bab695;
  --color-5: #b8b6ad;
}

SCSS

$color-1: #ba7070;
$color-2: #ba7a70;
$color-3: #bab370;
$color-4: #bab695;
$color-5: #b8b6ad;

TAILWIND

colors: {
  'brand-1': '#ba7070',
  'brand-2': '#ba7a70',
  'brand-3': '#bab370',
  'brand-4': '#bab695',
  'brand-5': '#b8b6ad',
}

RGB Array

[186, 112, 112], [186, 122, 112], [186, 179, 112], [186, 182, 149], [184, 182, 173]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BA7070, #BA7A70, #BAB370, #BAB695, #B8B6AD 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: #ba7070; --color-2: #ba7a70; --color-3: #bab370; --color-4: #bab695; --color-5: #b8b6ad. 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