← Back to Editor

#2F2C2B · #413726 · #79451D · #D7621A · #FD8D32

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#2F2C2B

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#2F2C2B
RGB
rgb(47, 44, 43)
HSL
hsl(15, 4%, 18%)
HSB
hsb(15, 9%, 18%)
CMYK
cmyk(0%, 6%, 9%, 82%)
Oklch
oklch(29.6% 0.005 39.4)

Traditional「Dark Cyan」· Paint「Dark Stone」· Creative Midnight Shadow

#413726

Ochre · DarkSlateGray · Cinnamon

HEX
#413726
RGB
rgb(65, 55, 38)
HSL
hsl(38, 26%, 20%)
HSB
hsb(38, 42%, 25%)
CMYK
cmyk(0%, 15%, 42%, 75%)
Oklch
oklch(34.2% 0.031 80.6)

Traditional「Ochre」· Paint「Cinnamon」· Creative Blush Sunrise

#79451D

Tangerine · Sienna · Amber Brown

HEX
#79451D
RGB
rgb(121, 69, 29)
HSL
hsl(26, 61%, 29%)
HSB
hsb(26, 76%, 47%)
CMYK
cmyk(0%, 43%, 76%, 53%)
Oklch
oklch(44.5% 0.089 55.2)

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

#D7621A

Tangerine · Chocolate · Amber Brown

HEX
#D7621A
RGB
rgb(215, 98, 26)
HSL
hsl(23, 78%, 47%)
HSB
hsb(23, 88%, 84%)
CMYK
cmyk(0%, 54%, 88%, 16%)
Oklch
oklch(63.1% 0.166 46.4)

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

#FD8D32

Tangerine · Coral · Warm Sun

HEX
#FD8D32
RGB
rgb(253, 141, 50)
HSL
hsl(27, 98%, 59%)
HSB
hsb(27, 80%, 99%)
CMYK
cmyk(0%, 44%, 80%, 1%)
Oklch
oklch(75.1% 0.167 54.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2F2C2B
2C2F30

Analogous

302C2D
2F2C2B
302F2C

Triadic

2F2C2B
2C302D
2D2C30

Split-Comp.

2F2C2B
2C302F
2C2D30

Tetradic

2F2C2B
2D302C
2C2F30
2F2C30

Contrast Matrix WCAG 2.1 Contrast

2F2C2B
413726
79451D
D7621A
FD8D32
—
1.2
Fail
1.8
Fail
3.7
AA Large
6.0
AA
1.2
Fail
—
1.5
Fail
3.1
AA Large
5.0
AA
1.8
Fail
1.5
Fail
—
2.1
Fail
3.4
AA Large
3.7
AA Large
3.1
AA Large
2.1
Fail
—
1.6
Fail
6.0
AA
5.0
AA
3.4
AA Large
1.6
Fail
—
White BG
13.9AAA
11.7AAA
7.8AAA
3.7AA Large
2.3Fail
Black BG
1.5Fail
1.8Fail
2.7Fail
5.7AA
9.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2E2E2B
3D3D2A
626227
A4A32B
CDCB48

Deuteranopia

2E2E2B
3D3E2B
666929
ABB430
D3DB4D

Tritanopia

2F2B2B
412D2E
762E30
D1393C
F7595D

Achromatopsia

2D2D2D
383838
505050
7D7D7D
A4A4A4

Shades & Tints Shades & Tints

#2F2C2B

Dark
Light

#413726

Dark
Light

#79451D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2f2c2b;
  --color-2: #413726;
  --color-3: #79451d;
  --color-4: #d7621a;
  --color-5: #fd8d32;
}

SCSS

$color-1: #2f2c2b;
$color-2: #413726;
$color-3: #79451d;
$color-4: #d7621a;
$color-5: #fd8d32;

TAILWIND

colors: {
  'brand-1': '#2f2c2b',
  'brand-2': '#413726',
  'brand-3': '#79451d',
  'brand-4': '#d7621a',
  'brand-5': '#fd8d32',
}

RGB Array

[47, 44, 43], [65, 55, 38], [121, 69, 29], [215, 98, 26], [253, 141, 50]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2F2C2B, #413726, #79451D, #D7621A, #FD8D32 is ideal for: tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #2f2c2b; --color-2: #413726; --color-3: #79451d; --color-4: #d7621a; --color-5: #fd8d32. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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