#381D2B + #642A32 + #CA9402 + #EBCE31 + #33393E - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#381D2B

Rose Purple · DarkSlateGray · Raspberry

HEX

#381D2B

RGB

rgb(56, 29, 43)

HSL

hsl(329, 32%, 17%)

HSB

hsb(329, 48%, 22%)

CMYK

cmyk(0%, 48%, 23%, 78%)

Oklch

oklch(27.3% 0.047 348.3)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

#642A32

Crimson · Brown · Wine Red

HEX

#642A32

RGB

rgb(100, 42, 50)

HSL

hsl(352, 41%, 28%)

HSB

hsb(352, 58%, 39%)

CMYK

cmyk(0%, 58%, 50%, 61%)

Oklch

oklch(36.9% 0.084 13.6)

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

#CA9402

Ochre · DarkGoldenRod · Honey Gold

HEX

#CA9402

RGB

rgb(202, 148, 2)

HSL

hsl(44, 98%, 40%)

HSB

hsb(44, 99%, 79%)

CMYK

cmyk(0%, 27%, 99%, 21%)

Oklch

oklch(70.0% 0.144 82.4)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#EBCE31

Autumn Sage · GoldenRod · Sunflower

HEX

#EBCE31

RGB

rgb(235, 206, 49)

HSL

hsl(51, 82%, 56%)

HSB

hsb(51, 79%, 92%)

CMYK

cmyk(0%, 12%, 79%, 8%)

Oklch

oklch(85.1% 0.164 97.9)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#33393E

Slate Blue · DarkSlateGray · Prussian Blue

HEX

#33393E

RGB

rgb(51, 57, 62)

HSL

hsl(207, 10%, 22%)

HSB

hsb(207, 18%, 24%)

CMYK

cmyk(18%, 8%, 0%, 76%)

Oklch

oklch(34.1% 0.012 243.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

381D2B

1D392B

Analogous

391D39

381D2B

391D1E

Triadic

381D2B

2C391D

1D2C39

Split-Comp.

381D2B

1E391D

1D3939

Tetradic

381D2B

39391D

1D392B

1D1E39

Contrast Matrix WCAG 2.1 Contrast

381D2B	642A32	CA9402	EBCE31	33393E
—	1.4 Fail	5.6 AA	9.7 AAA	1.3 Fail
1.4 Fail	—	4.0 AA Large	7.0 AA	1.1 Fail
5.6 AA	4.0 AA Large	—	1.7 Fail	4.3 AA Large
9.7 AAA	7.0 AA	1.7 Fail	—	7.5 AAA
1.3 Fail	1.1 Fail	4.3 AA Large	7.5 AAA	—

White BG

15.2AAA

10.9AAA

2.7Fail

1.6Fail

11.7AAA

Black BG

1.4Fail

1.9Fail

7.7AAA

13.4AAA

1.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

2C2C28

4B4A30

B3B225

DEDE57

36363D

Deuteranopia

2E3027

4E5330

B6BA2E

E0E260

35353D

Tritanopia

372524

612F2E

C74147

EA757C

333C3C

Achromatopsia

272727

3C3C3C

949494

C5C5C5

383838

Shades & Tints Shades & Tints

#381D2B

Dark

Light

#642A32

Dark

Light

#CA9402

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #381d2b;
  --color-2: #642a32;
  --color-3: #ca9402;
  --color-4: #ebce31;
  --color-5: #33393e;
}

SCSS

$color-1: #381d2b;
$color-2: #642a32;
$color-3: #ca9402;
$color-4: #ebce31;
$color-5: #33393e;

TAILWIND

colors: {
  'brand-1': '#381d2b',
  'brand-2': '#642a32',
  'brand-3': '#ca9402',
  'brand-4': '#ebce31',
  'brand-5': '#33393e',
}

RGB Array

[56, 29, 43], [100, 42, 50], [202, 148, 2], [235, 206, 49], [51, 57, 62]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #381D2B, #642A32, #CA9402, #EBCE31, #33393E 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: #381d2b; --color-2: #642a32; --color-3: #ca9402; --color-4: #ebce31; --color-5: #33393e. 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