#3D3C2A + #0E130D + #83752E + #AE3954 + #C32436 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#3D3C2A

Autumn Sage · DarkSlateGray · Amber Gold

HEX

#3D3C2A

RGB

rgb(61, 60, 42)

HSL

hsl(57, 18%, 20%)

HSB

hsb(57, 31%, 24%)

CMYK

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

Oklch

oklch(35.2% 0.030 105.1)

Traditional「Autumn Sage」· Paint「Amber Gold」· Creative Blush Sunrise

#0E130D

Celadon · Black · Dark Green

HEX

#0E130D

RGB

rgb(14, 19, 13)

HSL

hsl(110, 19%, 6%)

HSB

hsb(110, 32%, 7%)

CMYK

cmyk(26%, 0%, 32%, 93%)

Oklch

oklch(17.9% 0.014 140.4)

Traditional「Celadon」· Paint「Dark Green」· Creative Blush Sunrise

#83752E

Autumn Sage · Sienna · Honey Gold

HEX

#83752E

RGB

rgb(131, 117, 46)

HSL

hsl(50, 48%, 35%)

HSB

hsb(50, 65%, 51%)

CMYK

cmyk(0%, 11%, 65%, 49%)

Oklch

oklch(56.1% 0.092 98.2)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#AE3954

Crimson · Brown · Passion Red

HEX

#AE3954

RGB

rgb(174, 57, 84)

HSL

hsl(346, 51%, 45%)

HSB

hsb(346, 67%, 68%)

CMYK

cmyk(0%, 67%, 52%, 32%)

Oklch

oklch(52.0% 0.153 10.4)

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

#C32436

Vermilion · FireBrick · Passion Red

HEX

#C32436

RGB

rgb(195, 36, 54)

HSL

hsl(353, 69%, 45%)

HSB

hsb(353, 82%, 76%)

CMYK

cmyk(0%, 82%, 72%, 24%)

Oklch

oklch(53.2% 0.192 21.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3D3C2A

2A2B3C

Analogous

3C322A

3D3C2A

343C2A

Triadic

3D3C2A

2A3C3B

3B2A3C

Split-Comp.

3D3C2A

2A343C

322A3C

Tetradic

3D3C2A

2A3C32

2A2B3C

3C2A34

Contrast Matrix WCAG 2.1 Contrast

3D3C2A	0E130D	83752E	AE3954	C32436
—	1.7 Fail	2.4 Fail	1.9 Fail	1.9 Fail
1.7 Fail	—	4.1 AA Large	3.1 AA Large	3.2 AA Large
2.4 Fail	4.1 AA Large	—	1.3 Fail	1.3 Fail
1.9 Fail	3.1 AA Large	1.3 Fail	—	1.0 Fail
1.9 Fail	3.2 AA Large	1.3 Fail	1.0 Fail	—

White BG

11.2AAA

18.8AAA

4.6AA

6.0AA

5.8AA

Black BG

1.9Fail

1.1Fail

4.5AA

3.5AA Large

3.6AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

3D3D2E

10100E

7D7D3F

7B7A4D

7E7D32

Deuteranopia

3D3D2F

10100F

7E7F43

828B4C

879331

Tritanopia

3D3233

0E1010

824D50

A84847

BB2E2D

Achromatopsia

3A3A3A

111111

717171

5F5F5F

565656

Shades & Tints Shades & Tints

#3D3C2A

Dark

Light

#0E130D

Dark

Light

#83752E

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3d3c2a;
  --color-2: #0e130d;
  --color-3: #83752e;
  --color-4: #ae3954;
  --color-5: #c32436;
}

SCSS

$color-1: #3d3c2a;
$color-2: #0e130d;
$color-3: #83752e;
$color-4: #ae3954;
$color-5: #c32436;

TAILWIND

colors: {
  'brand-1': '#3d3c2a',
  'brand-2': '#0e130d',
  'brand-3': '#83752e',
  'brand-4': '#ae3954',
  'brand-5': '#c32436',
}

RGB Array

[61, 60, 42], [14, 19, 13], [131, 117, 46], [174, 57, 84], [195, 36, 54]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3D3C2A, #0E130D, #83752E, #AE3954, #C32436 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: #3d3c2a; --color-2: #0e130d; --color-3: #83752e; --color-4: #ae3954; --color-5: #c32436. 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