← Back to Editor

#75625A · #B37366 · #B39E66 · #9CBF63 · #BDC27E

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

#75625A

Tangerine · DimGray · Amber Brown

HEX
#75625A
RGB
rgb(117, 98, 90)
HSL
hsl(18, 13%, 41%)
HSB
hsb(18, 23%, 46%)
CMYK
cmyk(0%, 16%, 23%, 54%)
Oklch
oklch(51.2% 0.028 44.1)

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

#B37366

Crimson · Gray · Passion Red

HEX
#B37366
RGB
rgb(179, 115, 102)
HSL
hsl(10, 34%, 55%)
HSB
hsb(10, 43%, 70%)
CMYK
cmyk(0%, 36%, 43%, 30%)
Oklch
oklch(62.0% 0.084 32.1)

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

#B39E66

Ginger · Tan · Sunflower

HEX
#B39E66
RGB
rgb(179, 158, 102)
HSL
hsl(44, 34%, 55%)
HSB
hsb(44, 43%, 70%)
CMYK
cmyk(0%, 12%, 43%, 30%)
Oklch
oklch(70.5% 0.078 89.7)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#9CBF63

Grass Green · DarkSeaGreen · Olive Green

HEX
#9CBF63
RGB
rgb(156, 191, 99)
HSL
hsl(83, 42%, 57%)
HSB
hsb(83, 48%, 75%)
CMYK
cmyk(18%, 0%, 48%, 25%)
Oklch
oklch(75.8% 0.126 126.4)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#BDC27E

Fresh Green · Tan · Sunflower

HEX
#BDC27E
RGB
rgb(189, 194, 126)
HSL
hsl(64, 36%, 63%)
HSB
hsb(64, 35%, 76%)
CMYK
cmyk(3%, 0%, 35%, 24%)
Oklch
oklch(79.4% 0.089 111.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

75625A
5B6E76

Analogous

765B60
75625A
76715B

Triadic

75625A
5B7663
635B76

Split-Comp.

75625A
5B7671
5B6076

Tetradic

75625A
60765B
5B6E76
715B76

Contrast Matrix WCAG 2.1 Contrast

75625A
B37366
B39E66
9CBF63
BDC27E
—
1.5
Fail
2.2
Fail
2.8
Fail
3.1
AA Large
1.5
Fail
—
1.4
Fail
1.8
Fail
2.0
Fail
2.2
Fail
1.4
Fail
—
1.3
Fail
1.4
Fail
2.8
Fail
1.8
Fail
1.3
Fail
—
1.1
Fail
3.1
AA Large
2.0
Fail
1.4
Fail
1.1
Fail
—
White BG
5.8AA
3.8AA Large
2.6Fail
2.1Fail
1.9Fail
Black BG
3.7AA Large
5.6AA
8.0AAA
10.0AAA
11.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6D6D5C
979769
AAAA74
ABAB79
BFBF8E

Deuteranopia

6E6F5C
9BA06A
ABAD77
A9A77F
BFBE92

Tritanopia

745D5E
B06C6C
B27E81
9E8B8F
BD9B9E

Achromatopsia

676767
858585
9E9E9E
AAAAAA
B9B9B9

Shades & Tints Shades & Tints

#75625A

Dark
Light

#B37366

Dark
Light

#B39E66

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #75625a;
  --color-2: #b37366;
  --color-3: #b39e66;
  --color-4: #9cbf63;
  --color-5: #bdc27e;
}

SCSS

$color-1: #75625a;
$color-2: #b37366;
$color-3: #b39e66;
$color-4: #9cbf63;
$color-5: #bdc27e;

TAILWIND

colors: {
  'brand-1': '#75625a',
  'brand-2': '#b37366',
  'brand-3': '#b39e66',
  'brand-4': '#9cbf63',
  'brand-5': '#bdc27e',
}

RGB Array

[117, 98, 90], [179, 115, 102], [179, 158, 102], [156, 191, 99], [189, 194, 126]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #75625A, #B37366, #B39E66, #9CBF63, #BDC27E 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: #75625a; --color-2: #b37366; --color-3: #b39e66; --color-4: #9cbf63; --color-5: #bdc27e. 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