#193038 + #805D36 + #9E5B3E + #B55643 + #C94D47 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#193038

Slate Blue · DarkSlateGray · Peacock Green

HEX

#193038

RGB

rgb(25, 48, 56)

HSL

hsl(195, 38%, 16%)

HSB

hsb(195, 55%, 22%)

CMYK

cmyk(55%, 14%, 0%, 78%)

Oklch

oklch(29.4% 0.032 222.4)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#805D36

Ochre · Sienna · Amber Brown

HEX

#805D36

RGB

rgb(128, 93, 54)

HSL

hsl(32, 41%, 36%)

HSB

hsb(32, 58%, 50%)

CMYK

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

Oklch

oklch(50.6% 0.071 68.0)

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

#9E5B3E

Tangerine · Sienna · Amber Brown

HEX

#9E5B3E

RGB

rgb(158, 91, 62)

HSL

hsl(18, 44%, 43%)

HSB

hsb(18, 61%, 62%)

CMYK

cmyk(0%, 42%, 61%, 38%)

Oklch

oklch(54.2% 0.098 43.7)

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

#B55643

Crimson · Sienna · Passion Red

HEX

#B55643

RGB

rgb(181, 86, 67)

HSL

hsl(10, 46%, 49%)

HSB

hsb(10, 63%, 71%)

CMYK

cmyk(0%, 52%, 63%, 29%)

Oklch

oklch(56.7% 0.128 32.8)

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

#C94D47

Crimson · Sienna · Passion Red

HEX

#C94D47

RGB

rgb(201, 77, 71)

HSL

hsl(3, 55%, 53%)

HSB

hsb(3, 65%, 79%)

CMYK

cmyk(0%, 62%, 65%, 21%)

Oklch

oklch(58.5% 0.159 26.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

193038

382119

Analogous

193831

193038

192138

Triadic

193038

381931

313819

Split-Comp.

193038

381921

383119

Tetradic

193038

311938

382119

213819

Contrast Matrix WCAG 2.1 Contrast

193038	805D36	9E5B3E	B55643	C94D47
—	2.3 Fail	2.6 Fail	2.9 Fail	3.0 AA Large
2.3 Fail	—	1.1 Fail	1.2 Fail	1.3 Fail
2.6 Fail	1.1 Fail	—	1.1 Fail	1.2 Fail
2.9 Fail	1.2 Fail	1.1 Fail	—	1.1 Fail
3.0 AA Large	1.3 Fail	1.2 Fail	1.1 Fail	—

White BG

13.8AAA

5.9AA

5.2AA

4.8AA

4.5AA

Black BG

1.5Fail

3.5AA Large

4.0AA Large

4.4AA Large

4.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

232336

71713F

818045

8C8B48

939248

Deuteranopia

222036

737642

858A47

919949

9BA449

Tritanopia

1A3534

7E4749

9B4B4C

B04B4C

C34A4A

Achromatopsia

2A2A2A

636363

6C6C6C

707070

717171

Shades & Tints Shades & Tints

#193038

Dark

Light

#805D36

Dark

Light

#9E5B3E

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #193038;
  --color-2: #805d36;
  --color-3: #9e5b3e;
  --color-4: #b55643;
  --color-5: #c94d47;
}

SCSS

$color-1: #193038;
$color-2: #805d36;
$color-3: #9e5b3e;
$color-4: #b55643;
$color-5: #c94d47;

TAILWIND

colors: {
  'brand-1': '#193038',
  'brand-2': '#805d36',
  'brand-3': '#9e5b3e',
  'brand-4': '#b55643',
  'brand-5': '#c94d47',
}

RGB Array

[25, 48, 56], [128, 93, 54], [158, 91, 62], [181, 86, 67], [201, 77, 71]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #193038, #805D36, #9E5B3E, #B55643, #C94D47 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: #193038; --color-2: #805d36; --color-3: #9e5b3e; --color-4: #b55643; --color-5: #c94d47. 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