← Back to Editor

#332A2A · #000312 · #545766 · #0F1100 · #C3CB00

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#332A2A

Crimson · DarkSlateGray · Deep Berry

HEX
#332A2A
RGB
rgb(51, 42, 42)
HSL
hsl(0, 10%, 18%)
HSB
hsb(0, 18%, 20%)
CMYK
cmyk(0%, 18%, 18%, 80%)
Oklch
oklch(29.5% 0.013 17.9)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#000312

Indigo · Black · Deep Sea Blue

HEX
#000312
RGB
rgb(0, 3, 18)
HSL
hsl(230, 100%, 4%)
HSB
hsb(230, 100%, 7%)
CMYK
cmyk(100%, 83%, 0%, 93%)
Oklch
oklch(10.5% 0.043 259.9)

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

#545766

Indigo · DimGray · Prussian Blue

HEX
#545766
RGB
rgb(84, 87, 102)
HSL
hsl(230, 10%, 36%)
HSB
hsb(230, 18%, 40%)
CMYK
cmyk(18%, 15%, 0%, 60%)
Oklch
oklch(46.0% 0.025 276.5)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#0F1100

Autumn Sage · Black · Amber Gold

HEX
#0F1100
RGB
rgb(15, 17, 0)
HSL
hsl(67, 100%, 3%)
HSB
hsb(67, 100%, 7%)
CMYK
cmyk(12%, 0%, 100%, 93%)
Oklch
oklch(17.0% 0.038 114.7)

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

#C3CB00

Autumn Sage · GoldenRod · Honey Gold

HEX
#C3CB00
RGB
rgb(195, 203, 0)
HSL
hsl(62, 100%, 40%)
HSB
hsb(62, 100%, 80%)
CMYK
cmyk(4%, 0%, 100%, 20%)
Oklch
oklch(80.9% 0.180 112.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

332A2A
293232

Analogous

32292E
332A2A
322E29

Triadic

332A2A
293229
292932

Split-Comp.

332A2A
29322E
292E32

Tetradic

332A2A
2E3229
293232
2E2932

Contrast Matrix WCAG 2.1 Contrast

332A2A
000312
545766
0F1100
C3CB00
—
1.5
Fail
1.9
Fail
1.4
Fail
7.9
AAA
1.5
Fail
—
2.9
Fail
1.1
Fail
11.6
AAA
1.9
Fail
2.9
Fail
—
2.7
Fail
4.0
AA Large
1.4
Fail
1.1
Fail
2.7
Fail
—
10.8
AAA
7.9
AAA
11.6
AAA
4.0
AA Large
10.8
AAA
—
White BG
13.9AAA
20.6AAA
7.2AAA
19.1AAA
1.8Fail
Black BG
1.5Fail
1.0Fail
2.9Fail
1.1Fail
11.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2F2F2A
01010E
555562
101004
C6C731

Deuteranopia

30302A
01010E
555561
101005
C6C53D

Tritanopia

332A2A
000C0B
54605F
0F0708
C35860

Achromatopsia

2D2D2D
040404
585858
0E0E0E
B1B1B1

Shades & Tints Shades & Tints

#332A2A

Dark
Light

#000312

Dark
Light

#545766

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #332a2a;
  --color-2: #000312;
  --color-3: #545766;
  --color-4: #0f1100;
  --color-5: #c3cb00;
}

SCSS

$color-1: #332a2a;
$color-2: #000312;
$color-3: #545766;
$color-4: #0f1100;
$color-5: #c3cb00;

TAILWIND

colors: {
  'brand-1': '#332a2a',
  'brand-2': '#000312',
  'brand-3': '#545766',
  'brand-4': '#0f1100',
  'brand-5': '#c3cb00',
}

RGB Array

[51, 42, 42], [0, 3, 18], [84, 87, 102], [15, 17, 0], [195, 203, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #332A2A, #000312, #545766, #0F1100, #C3CB00 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #332a2a; --color-2: #000312; --color-3: #545766; --color-4: #0f1100; --color-5: #c3cb00. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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