← Back to Editor

#3D1A3A · #623752 · #FFE88A · #FDD542 · #2B0C11

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#3D1A3A

Rose Purple · DarkSlateGray · Dark Purple

HEX
#3D1A3A
RGB
rgb(61, 26, 58)
HSL
hsl(305, 40%, 17%)
HSB
hsb(305, 57%, 24%)
CMYK
cmyk(0%, 57%, 5%, 76%)
Oklch
oklch(28.2% 0.073 330.6)

Traditional「Rose Purple」· Paint「Dark Purple」· Creative Blush Sunrise

#623752

Rose Purple · DimGray · Camellia

HEX
#623752
RGB
rgb(98, 55, 82)
HSL
hsl(322, 28%, 30%)
HSB
hsb(322, 44%, 38%)
CMYK
cmyk(0%, 44%, 16%, 62%)
Oklch
oklch(39.9% 0.072 342.6)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

#FFE88A

Goose Yellow · Khaki · Lemon Cream

HEX
#FFE88A
RGB
rgb(255, 232, 138)
HSL
hsl(48, 100%, 77%)
HSB
hsb(48, 46%, 100%)
CMYK
cmyk(0%, 9%, 46%, 0%)
Oklch
oklch(93.0% 0.117 96.0)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#FDD542

Ginger · SandyBrown · Sunflower

HEX
#FDD542
RGB
rgb(253, 213, 66)
HSL
hsl(47, 98%, 63%)
HSB
hsb(47, 74%, 99%)
CMYK
cmyk(0%, 16%, 74%, 1%)
Oklch
oklch(88.3% 0.161 93.1)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#2B0C11

Crimson · Black · Deep Berry

HEX
#2B0C11
RGB
rgb(43, 12, 17)
HSL
hsl(350, 56%, 11%)
HSB
hsb(350, 72%, 17%)
CMYK
cmyk(0%, 72%, 60%, 83%)
Oklch
oklch(20.8% 0.052 12.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3D1A3A
1A3D1D

Analogous

2E1A3D
3D1A3A
3D1A28

Triadic

3D1A3A
3A3D1A
1A3A3D

Split-Comp.

3D1A3A
283D1A
1A3D2E

Tetradic

3D1A3A
3D2E1A
1A3D1D
1A283D

Contrast Matrix WCAG 2.1 Contrast

3D1A3A
623752
FFE88A
FDD542
2B0C11
—
1.6
Fail
12.2
AAA
10.5
AAA
1.2
Fail
1.6
Fail
—
7.8
AAA
6.8
AA
1.9
Fail
12.2
AAA
7.8
AAA
—
1.2
Fail
14.8
AAA
10.5
AAA
6.8
AA
1.2
Fail
—
12.7
AAA
1.2
Fail
1.9
Fail
14.8
AAA
12.7
AAA
—
White BG
14.9AAA
9.6AAA
1.2Fail
1.4Fail
18.1AAA
Black BG
1.4Fail
2.2Fail
17.2AAA
14.8AAA
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

2E2E32
4F4F4B
F5F5A1
ECEB66
1E1D10

Deuteranopia

303230
52554A
F6F8A6
EEF16E
1F220F

Tritanopia

3B2C2B
604645
FEB3B7
FB8288
290F0F

Achromatopsia

282828
474747
E4E4E4
D0D0D0
161616

Shades & Tints Shades & Tints

#3D1A3A

Dark
Light

#623752

Dark
Light

#FFE88A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3d1a3a;
  --color-2: #623752;
  --color-3: #ffe88a;
  --color-4: #fdd542;
  --color-5: #2b0c11;
}

SCSS

$color-1: #3d1a3a;
$color-2: #623752;
$color-3: #ffe88a;
$color-4: #fdd542;
$color-5: #2b0c11;

TAILWIND

colors: {
  'brand-1': '#3d1a3a',
  'brand-2': '#623752',
  'brand-3': '#ffe88a',
  'brand-4': '#fdd542',
  'brand-5': '#2b0c11',
}

RGB Array

[61, 26, 58], [98, 55, 82], [255, 232, 138], [253, 213, 66], [43, 12, 17]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3D1A3A, #623752, #FFE88A, #FDD542, #2B0C11 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #3d1a3a; --color-2: #623752; --color-3: #ffe88a; --color-4: #fdd542; --color-5: #2b0c11. 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 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