← Back to Editor

#151B2B · #BA2334 · #AA7156 · #C1892C · #928074

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

#151B2B

Indigo · Black · Deep Sea Blue

HEX
#151B2B
RGB
rgb(21, 27, 43)
HSL
hsl(224, 34%, 13%)
HSB
hsb(224, 51%, 17%)
CMYK
cmyk(51%, 37%, 0%, 83%)
Oklch
oklch(22.4% 0.033 268.0)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#BA2334

Vermilion · FireBrick · Passion Red

HEX
#BA2334
RGB
rgb(186, 35, 52)
HSL
hsl(353, 68%, 43%)
HSB
hsb(353, 81%, 73%)
CMYK
cmyk(0%, 81%, 72%, 27%)
Oklch
oklch(51.5% 0.185 21.5)

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

#AA7156

Tangerine · Sienna · Amber Brown

HEX
#AA7156
RGB
rgb(170, 113, 86)
HSL
hsl(19, 33%, 50%)
HSB
hsb(19, 49%, 67%)
CMYK
cmyk(0%, 34%, 49%, 33%)
Oklch
oklch(60.2% 0.083 46.1)

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

#C1892C

Ochre · DarkGoldenRod · Amber Brown

HEX
#C1892C
RGB
rgb(193, 137, 44)
HSL
hsl(37, 63%, 46%)
HSB
hsb(37, 77%, 76%)
CMYK
cmyk(0%, 29%, 77%, 24%)
Oklch
oklch(67.0% 0.125 75.6)

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

#928074

Tangerine · Gray · Warm Sun

HEX
#928074
RGB
rgb(146, 128, 116)
HSL
hsl(24, 12%, 51%)
HSB
hsb(24, 21%, 57%)
CMYK
cmyk(0%, 12%, 21%, 43%)
Oklch
oklch(61.3% 0.028 55.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

151B2B
2C2616

Analogous

16272C
151B2B
1B162C

Triadic

151B2B
2C161C
1C2C16

Split-Comp.

151B2B
2C1B16
272C16

Tetradic

151B2B
2C1627
2C2616
162C1B

Contrast Matrix WCAG 2.1 Contrast

151B2B
BA2334
AA7156
C1892C
928074
—
2.8
Fail
4.3
AA Large
5.6
AA
4.5
AA
2.8
Fail
—
1.5
Fail
2.0
Fail
1.6
Fail
4.3
AA Large
1.5
Fail
—
1.3
Fail
1.1
Fail
5.6
AA
2.0
Fail
1.3
Fail
—
1.2
Fail
4.5
AA
1.6
Fail
1.1
Fail
1.2
Fail
—
White BG
17.2AAA
6.2AA
4.0AA Large
3.1AA Large
3.8AA Large
Black BG
1.2Fail
3.4AA Large
5.2AA
6.9AA
5.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

181827
797730
91915D
A9A843
8A8A77

Deuteranopia

171726
818D2F
95995E
ACB048
8B8D78

Tritanopia

152423
B22D2C
A76263
BE5458
91797A

Achromatopsia

1B1B1B
525252
7F7F7F
8F8F8F
848484

Shades & Tints Shades & Tints

#151B2B

Dark
Light

#BA2334

Dark
Light

#AA7156

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #151b2b;
  --color-2: #ba2334;
  --color-3: #aa7156;
  --color-4: #c1892c;
  --color-5: #928074;
}

SCSS

$color-1: #151b2b;
$color-2: #ba2334;
$color-3: #aa7156;
$color-4: #c1892c;
$color-5: #928074;

TAILWIND

colors: {
  'brand-1': '#151b2b',
  'brand-2': '#ba2334',
  'brand-3': '#aa7156',
  'brand-4': '#c1892c',
  'brand-5': '#928074',
}

RGB Array

[21, 27, 43], [186, 35, 52], [170, 113, 86], [193, 137, 44], [146, 128, 116]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #151B2B, #BA2334, #AA7156, #C1892C, #928074 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: #151b2b; --color-2: #ba2334; --color-3: #aa7156; --color-4: #c1892c; --color-5: #928074. 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