#291B3E + #513953 + #69484F + #B16A4E + #CC7355 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#291B3E

Deep Indigo · MidnightBlue · Dark Purple

HEX

#291B3E

RGB

rgb(41, 27, 62)

HSL

hsl(264, 39%, 17%)

HSB

hsb(264, 56%, 24%)

CMYK

cmyk(34%, 56%, 0%, 76%)

Oklch

oklch(25.9% 0.065 300.4)

Traditional「Deep Indigo」· Paint「Dark Purple」· Creative Blush Sunrise

#513953

Dark Plum · DarkSlateGray · Eggplant

HEX

#513953

RGB

rgb(81, 57, 83)

HSL

hsl(295, 19%, 27%)

HSB

hsb(295, 31%, 33%)

CMYK

cmyk(2%, 31%, 0%, 67%)

Oklch

oklch(38.2% 0.053 324.0)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#69484F

Crimson · DimGray · Wine Red

HEX

#69484F

RGB

rgb(105, 72, 79)

HSL

hsl(347, 19%, 35%)

HSB

hsb(347, 31%, 41%)

CMYK

cmyk(0%, 31%, 25%, 59%)

Oklch

oklch(44.0% 0.046 5.2)

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

#B16A4E

Tangerine · Sienna · Amber Brown

HEX

#B16A4E

RGB

rgb(177, 106, 78)

HSL

hsl(17, 39%, 50%)

HSB

hsb(17, 56%, 69%)

CMYK

cmyk(0%, 40%, 56%, 31%)

Oklch

oklch(59.6% 0.100 42.1)

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

#CC7355

Tangerine · Coral · Warm Sun

HEX

#CC7355

RGB

rgb(204, 115, 85)

HSL

hsl(15, 54%, 57%)

HSB

hsb(15, 58%, 80%)

CMYK

cmyk(0%, 44%, 58%, 20%)

Oklch

oklch(64.8% 0.120 39.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

291B3E

2F3C1A

Analogous

1A1E3C

291B3E

391A3C

Triadic

291B3E

3C281A

1A3C28

Split-Comp.

291B3E

3C391A

1E3C1A

Tetradic

291B3E

3C1A1E

2F3C1A

1A3C39

Contrast Matrix WCAG 2.1 Contrast

291B3E	513953	69484F	B16A4E	CC7355
—	1.6 Fail	2.0 Fail	3.8 AA Large	4.7 AA
1.6 Fail	—	1.3 Fail	2.4 Fail	3.0 Fail
2.0 Fail	1.3 Fail	—	1.9 Fail	2.3 Fail
3.8 AA Large	2.4 Fail	1.9 Fail	—	1.2 Fail
4.7 AA	3.0 Fail	2.3 Fail	1.2 Fail	—

White BG

15.9AAA

10.2AAA

8.0AAA

4.2AA Large

3.4AA Large

Black BG

1.3Fail

2.1Fail

2.6Fail

5.0AA

6.2AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

232336

47464D

5B5A4D

929255

A5A55C

Deuteranopia

242534

484A4B

5D5F4D

969C56

ABB15E

Tritanopia

282F2D

504847

674C4C

AD5A5B

C86263

Achromatopsia

232323

434343

535353

7C7C7C

8A8A8A

Shades & Tints Shades & Tints

#291B3E

Dark

Light

#513953

Dark

Light

#69484F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #291b3e;
  --color-2: #513953;
  --color-3: #69484f;
  --color-4: #b16a4e;
  --color-5: #cc7355;
}

SCSS

$color-1: #291b3e;
$color-2: #513953;
$color-3: #69484f;
$color-4: #b16a4e;
$color-5: #cc7355;

TAILWIND

colors: {
  'brand-1': '#291b3e',
  'brand-2': '#513953',
  'brand-3': '#69484f',
  'brand-4': '#b16a4e',
  'brand-5': '#cc7355',
}

RGB Array

[41, 27, 62], [81, 57, 83], [105, 72, 79], [177, 106, 78], [204, 115, 85]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #291B3E, #513953, #69484F, #B16A4E, #CC7355 is ideal for: tech websites, dark mode UIs, game UIs. 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: #291b3e; --color-2: #513953; --color-3: #69484f; --color-4: #b16a4e; --color-5: #cc7355. 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. 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