← Back to Editor

#B1AD49 · #92BDAA · #7EDBC7 · #815B70 · #6D3049

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#B1AD49

Autumn Sage · GoldenRod · Honey Gold

HEX
#B1AD49
RGB
rgb(177, 173, 73)
HSL
hsl(58, 42%, 49%)
HSB
hsb(58, 59%, 69%)
CMYK
cmyk(0%, 2%, 59%, 31%)
Oklch
oklch(73.1% 0.122 106.9)

TraditionalAutumn Sage」· PaintHoney Gold」· Creative Blush Sunrise

#92BDAA

Jade · DarkSeaGreen · Apple Green

HEX
#92BDAA
RGB
rgb(146, 189, 170)
HSL
hsl(153, 25%, 66%)
HSB
hsb(153, 23%, 74%)
CMYK
cmyk(23%, 0%, 10%, 26%)
Oklch
oklch(76.2% 0.053 166.1)

TraditionalJade」· PaintApple Green」· Creative Arctic Pool

#7EDBC7

Jade · SkyBlue · Lake Green

HEX
#7EDBC7
RGB
rgb(126, 219, 199)
HSL
hsl(167, 56%, 68%)
HSB
hsb(167, 42%, 86%)
CMYK
cmyk(42%, 0%, 9%, 14%)
Oklch
oklch(82.8% 0.094 178.4)

TraditionalJade」· PaintLake Green」· Creative Arctic Pool

#815B70

Rose Purple · DimGray · Camellia

HEX
#815B70
RGB
rgb(129, 91, 112)
HSL
hsl(327, 17%, 43%)
HSB
hsb(327, 29%, 51%)
CMYK
cmyk(0%, 29%, 13%, 49%)
Oklch
oklch(51.8% 0.058 345.0)

TraditionalRose Purple」· PaintCamellia」· Creative Blush Sunrise

#6D3049

Dark Violet · Brown · Camellia

HEX
#6D3049
RGB
rgb(109, 48, 73)
HSL
hsl(335, 39%, 31%)
HSB
hsb(335, 56%, 43%)
CMYK
cmyk(0%, 56%, 33%, 57%)
Oklch
oklch(40.0% 0.092 356.3)

TraditionalDark Violet」· PaintCamellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B1AD49
484CB1

Analogous

B17948
B1AD49
80B148

Triadic

B1AD49
48B1AE
AE48B1

Split-Comp.

B1AD49
4880B1
7948B1

Tetradic

B1AD49
48B179
484CB1
B14880

Contrast Matrix WCAG 2.1 Contrast

B1AD49
92BDAA
7EDBC7
815B70
6D3049
1.1
Fail
1.4
Fail
2.4
Fail
4.1
AA Large
1.1
Fail
1.3
Fail
2.8
Fail
4.6
AA
1.4
Fail
1.3
Fail
3.5
AA Large
5.9
AA
2.4
Fail
2.8
Fail
3.5
AA Large
1.7
Fail
4.1
AA Large
4.6
AA
5.9
AA
1.7
Fail
White BG
2.3Fail
2.1Fail
1.6Fail
5.7AA
9.7AAA
Black BG
8.9AAA
10.1AAA
12.8AAA
3.7AA Large
2.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

AFAF61
A5A5AF
A6A7CC
71706B
535243

Deuteranopia

B0B067
A29FB0
A19ACD
73766A
565B42

Tritanopia

B17479
94B2B3
83D0D1
7F6766
6A3E3D

Achromatopsia

A3A3A3
AEAEAE
BDBDBD
696969
454545

Shades & Tints Shades & Tints

#B1AD49

Dark
Light

#92BDAA

Dark
Light

#7EDBC7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b1ad49;
  --color-2: #92bdaa;
  --color-3: #7edbc7;
  --color-4: #815b70;
  --color-5: #6d3049;
}

SCSS

$color-1: #b1ad49;
$color-2: #92bdaa;
$color-3: #7edbc7;
$color-4: #815b70;
$color-5: #6d3049;

TAILWIND

colors: {
  'brand-1': '#b1ad49',
  'brand-2': '#92bdaa',
  'brand-3': '#7edbc7',
  'brand-4': '#815b70',
  'brand-5': '#6d3049',
}

RGB Array

[177, 173, 73], [146, 189, 170], [126, 219, 199], [129, 91, 112], [109, 48, 73]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B1AD49, #92BDAA, #7EDBC7, #815B70, #6D3049 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: #b1ad49; --color-2: #92bdaa; --color-3: #7edbc7; --color-4: #815b70; --color-5: #6d3049. 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