← Back to Editor

#020202 · #3C2515 · #FF6F3C · #464334 · #FFE534

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

#020202

Ink Black · Black · Jet Black

HEX
#020202
RGB
rgb(2, 2, 2)
HSL
hsl(0, 0%, 1%)
HSB
hsb(0, 0%, 1%)
CMYK
cmyk(0%, 0%, 0%, 99%)
Oklch
oklch(8.5% 0.000 89.9)

Traditional「Ink Black」· Paint「Jet Black」· Creative Midnight Shadow

#3C2515

Tangerine · DarkSlateGray · Cinnamon

HEX
#3C2515
RGB
rgb(60, 37, 21)
HSL
hsl(25, 48%, 16%)
HSB
hsb(25, 65%, 24%)
CMYK
cmyk(0%, 38%, 65%, 76%)
Oklch
oklch(28.9% 0.044 54.9)

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

#FF6F3C

Apricot · Tomato · Warm Sun

HEX
#FF6F3C
RGB
rgb(255, 111, 60)
HSL
hsl(16, 100%, 62%)
HSB
hsb(16, 76%, 100%)
CMYK
cmyk(0%, 56%, 76%, 0%)
Oklch
oklch(71.0% 0.187 39.1)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#464334

Autumn Sage · DarkSlateGray · Amber Gold

HEX
#464334
RGB
rgb(70, 67, 52)
HSL
hsl(50, 15%, 24%)
HSB
hsb(50, 26%, 27%)
CMYK
cmyk(0%, 4%, 26%, 73%)
Oklch
oklch(38.1% 0.025 98.0)

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

#FFE534

Autumn Sage · Gold · Sunflower

HEX
#FFE534
RGB
rgb(255, 229, 52)
HSL
hsl(52, 100%, 60%)
HSB
hsb(52, 80%, 100%)
CMYK
cmyk(0%, 10%, 80%, 0%)
Oklch
oklch(91.6% 0.179 100.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

020202
030303

Analogous

030303
020202
030303

Triadic

020202
030303
030303

Split-Comp.

020202
030303
030303

Tetradic

020202
030303
030303
030303

Contrast Matrix WCAG 2.1 Contrast

020202
3C2515
FF6F3C
464334
FFE534
—
1.4
Fail
7.5
AAA
2.1
Fail
16.3
AAA
1.4
Fail
—
5.2
AA
1.4
Fail
11.2
AAA
7.5
AAA
5.2
AA
—
3.6
AA Large
2.2
Fail
2.1
Fail
1.4
Fail
3.6
AA Large
—
7.8
AAA
16.3
AAA
11.2
AAA
2.2
Fail
7.8
AAA
—
White BG
20.7AAA
14.3AAA
2.8Fail
9.9AAA
1.3Fail
Black BG
1.0Fail
1.5Fail
7.6AAA
2.1Fail
16.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

020202
323219
C1BF48
454538
F4F45F

Deuteranopia

020202
33351A
C9D44B
454539
F5F769

Tritanopia

020202
3B1C1D
F85254
463A3B
FE8188

Achromatopsia

020202
2A2A2A
949494
424242
D9D9D9

Shades & Tints Shades & Tints

#020202

Dark
Light

#3C2515

Dark
Light

#FF6F3C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #020202;
  --color-2: #3c2515;
  --color-3: #ff6f3c;
  --color-4: #464334;
  --color-5: #ffe534;
}

SCSS

$color-1: #020202;
$color-2: #3c2515;
$color-3: #ff6f3c;
$color-4: #464334;
$color-5: #ffe534;

TAILWIND

colors: {
  'brand-1': '#020202',
  'brand-2': '#3c2515',
  'brand-3': '#ff6f3c',
  'brand-4': '#464334',
  'brand-5': '#ffe534',
}

RGB Array

[2, 2, 2], [60, 37, 21], [255, 111, 60], [70, 67, 52], [255, 229, 52]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #020202, #3C2515, #FF6F3C, #464334, #FFE534 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: #020202; --color-2: #3c2515; --color-3: #ff6f3c; --color-4: #464334; --color-5: #ffe534. 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