← Back to Editor

#243C4A · #523730 · #B84C2E · #A66632 · #B9BA88

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 LibraryData Visualization

Color Details Color Details

#243C4A

Slate Blue · DarkSlateGray · Prussian Blue

HEX
#243C4A
RGB
rgb(36, 60, 74)
HSL
hsl(202, 35%, 22%)
HSB
hsb(202, 51%, 29%)
CMYK
cmyk(51%, 19%, 0%, 71%)
Oklch
oklch(34.3% 0.039 235.1)

Traditional「Slate Blue」· Paint「Prussian Blue」· Creative Blush Sunrise

#523730

Crimson · DarkOliveGreen · Wine Red

HEX
#523730
RGB
rgb(82, 55, 48)
HSL
hsl(12, 26%, 25%)
HSB
hsb(12, 41%, 32%)
CMYK
cmyk(0%, 33%, 41%, 68%)
Oklch
oklch(36.6% 0.041 35.1)

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

#B84C2E

Crimson · Sienna · Passion Red

HEX
#B84C2E
RGB
rgb(184, 76, 46)
HSL
hsl(13, 60%, 45%)
HSB
hsb(13, 75%, 72%)
CMYK
cmyk(0%, 59%, 75%, 28%)
Oklch
oklch(55.4% 0.147 36.3)

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

#A66632

Tangerine · Sienna · Amber Brown

HEX
#A66632
RGB
rgb(166, 102, 50)
HSL
hsl(27, 54%, 42%)
HSB
hsb(27, 70%, 65%)
CMYK
cmyk(0%, 39%, 70%, 35%)
Oklch
oklch(57.1% 0.106 57.3)

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

#B9BA88

Fresh Green · Tan · Sunflower

HEX
#B9BA88
RGB
rgb(185, 186, 136)
HSL
hsl(61, 27%, 63%)
HSB
hsb(61, 27%, 73%)
CMYK
cmyk(1%, 0%, 27%, 27%)
Oklch
oklch(77.6% 0.067 108.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

243C4A
4C3324

Analogous

244C46
243C4A
242A4C

Triadic

243C4A
4C243D
3D4C24

Split-Comp.

243C4A
4C242A
4C4624

Tetradic

243C4A
46244C
4C3324
2A4C24

Contrast Matrix WCAG 2.1 Contrast

243C4A
523730
B84C2E
A66632
B9BA88
—
1.1
Fail
2.3
Fail
2.5
Fail
5.7
AA
1.1
Fail
—
2.1
Fail
2.3
Fail
5.4
AA
2.3
Fail
2.1
Fail
—
1.1
Fail
2.5
Fail
2.5
Fail
2.3
Fail
1.1
Fail
—
2.3
Fail
5.7
AA
5.4
AA
2.5
Fail
2.3
Fail
—
White BG
11.5AAA
10.8AAA
5.1AA
4.6AA
2.0Fail
Black BG
1.8Fail
1.9Fail
4.1AA Large
4.6AA
10.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2E2F47
464632
898835
8A8A3F
B9B994

Deuteranopia

2D2B46
484A32
909837
8E9342
B9B997

Tritanopia

254443
513333
B33B3C
A3494B
B99EA0

Achromatopsia

363636
3E3E3E
696969
737373
B4B4B4

Shades & Tints Shades & Tints

#243C4A

Dark
Light

#523730

Dark
Light

#B84C2E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #243c4a;
  --color-2: #523730;
  --color-3: #b84c2e;
  --color-4: #a66632;
  --color-5: #b9ba88;
}

SCSS

$color-1: #243c4a;
$color-2: #523730;
$color-3: #b84c2e;
$color-4: #a66632;
$color-5: #b9ba88;

TAILWIND

colors: {
  'brand-1': '#243c4a',
  'brand-2': '#523730',
  'brand-3': '#b84c2e',
  'brand-4': '#a66632',
  'brand-5': '#b9ba88',
}

RGB Array

[36, 60, 74], [82, 55, 48], [184, 76, 46], [166, 102, 50], [185, 186, 136]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #243C4A, #523730, #B84C2E, #A66632, #B9BA88 is ideal for: tech websites, dark mode UIs, game UIs, 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: #243c4a; --color-2: #523730; --color-3: #b84c2e; --color-4: #a66632; --color-5: #b9ba88. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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