#13131F + #14393F + #245551 + #975638 + #BF4F1F - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#13131F

Deep Indigo · Black · Deep Sea Blue

HEX

#13131F

RGB

rgb(19, 19, 31)

HSL

hsl(240, 24%, 10%)

HSB

hsb(240, 39%, 12%)

CMYK

cmyk(39%, 39%, 0%, 88%)

Oklch

oklch(19.3% 0.024 283.9)

Traditional「Deep Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#14393F

Lake Blue · DarkSlateGray · Peacock Green

HEX

#14393F

RGB

rgb(20, 57, 63)

HSL

hsl(188, 52%, 16%)

HSB

hsb(188, 68%, 25%)

CMYK

cmyk(68%, 10%, 0%, 75%)

Oklch

oklch(32.1% 0.043 209.7)

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

#245551

Mineral Blue · DarkSlateGray · Peacock Green

HEX

#245551

RGB

rgb(36, 85, 81)

HSL

hsl(175, 40%, 24%)

HSB

hsb(175, 58%, 33%)

CMYK

cmyk(58%, 0%, 5%, 67%)

Oklch

oklch(41.5% 0.053 188.2)

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

#975638

Tangerine · Sienna · Amber Brown

HEX

#975638

RGB

rgb(151, 86, 56)

HSL

hsl(19, 46%, 41%)

HSB

hsb(19, 63%, 59%)

CMYK

cmyk(0%, 43%, 63%, 41%)

Oklch

oklch(52.2% 0.097 44.8)

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

#BF4F1F

Tangerine · Chocolate · Amber Brown

HEX

#BF4F1F

RGB

rgb(191, 79, 31)

HSL

hsl(18, 72%, 44%)

HSB

hsb(18, 84%, 75%)

CMYK

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

Oklch

oklch(56.8% 0.156 41.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

13131F

202013

Analogous

131A20

13131F

1A1320

Triadic

13131F

201313

132013

Split-Comp.

13131F

201A13

1A2013

Tetradic

13131F

20131A

202013

13201A

Contrast Matrix WCAG 2.1 Contrast

13131F	14393F	245551	975638	BF4F1F
—	1.5 Fail	2.2 Fail	3.2 AA Large	3.8 AA Large
1.5 Fail	—	1.5 Fail	2.2 Fail	2.6 Fail
2.2 Fail	1.5 Fail	—	1.5 Fail	1.7 Fail
3.2 AA Large	2.2 Fail	1.5 Fail	—	1.2 Fail
3.8 AA Large	2.6 Fail	1.7 Fail	1.2 Fail	—

White BG

18.4AAA

12.4AAA

8.4AAA

5.7AA

4.8AA

Black BG

1.1Fail

1.7Fail

2.5Fail

3.7AA Large

4.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

13131C

24243E

393A52

7B7A3F

8F8D2B

Deuteranopia

13131B

221F3D

363352

7F8441

959D2D

Tritanopia

131A19

163C3C

265353

944546

B93436

Achromatopsia

141414

2F2F2F

464646

666666

6B6B6B

Shades & Tints Shades & Tints

#13131F

Dark

Light

#14393F

Dark

Light

#245551

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #13131f;
  --color-2: #14393f;
  --color-3: #245551;
  --color-4: #975638;
  --color-5: #bf4f1f;
}

SCSS

$color-1: #13131f;
$color-2: #14393f;
$color-3: #245551;
$color-4: #975638;
$color-5: #bf4f1f;

TAILWIND

colors: {
  'brand-1': '#13131f',
  'brand-2': '#14393f',
  'brand-3': '#245551',
  'brand-4': '#975638',
  'brand-5': '#bf4f1f',
}

RGB Array

[19, 19, 31], [20, 57, 63], [36, 85, 81], [151, 86, 56], [191, 79, 31]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #13131F, #14393F, #245551, #975638, #BF4F1F 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: #13131f; --color-2: #14393f; --color-3: #245551; --color-4: #975638; --color-5: #bf4f1f. 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