← Back to Editor

#2D2633 · #6C3FF4 · #74A6E3 · #3FF2AB · #FAF5D2

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 AppData Visualization

Color Details Color Details

#2D2633

Dark Plum · DarkSlateGray · Dark Purple

HEX
#2D2633
RGB
rgb(45, 38, 51)
HSL
hsl(272, 15%, 17%)
HSB
hsb(272, 25%, 20%)
CMYK
cmyk(12%, 25%, 0%, 80%)
Oklch
oklch(28.2% 0.025 309.1)

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

#6C3FF4

Deep Indigo · MediumSlateBlue · Navy Blue

HEX
#6C3FF4
RGB
rgb(108, 63, 244)
HSL
hsl(255, 89%, 60%)
HSB
hsb(255, 74%, 96%)
CMYK
cmyk(56%, 74%, 0%, 4%)
Oklch
oklch(53.8% 0.250 285.8)

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

#74A6E3

Azure · CornflowerBlue · Cobalt Blue

HEX
#74A6E3
RGB
rgb(116, 166, 227)
HSL
hsl(213, 66%, 67%)
HSB
hsb(213, 49%, 89%)
CMYK
cmyk(49%, 27%, 0%, 11%)
Oklch
oklch(71.4% 0.105 254.0)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#3FF2AB

Mineral Blue · Turquoise · Olive Green

HEX
#3FF2AB
RGB
rgb(63, 242, 171)
HSL
hsl(156, 87%, 60%)
HSB
hsb(156, 74%, 95%)
CMYK
cmyk(74%, 0%, 29%, 5%)
Oklch
oklch(85.6% 0.174 161.4)

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

#FAF5D2

Fresh Green · Beige · Lemon Cream

HEX
#FAF5D2
RGB
rgb(250, 245, 210)
HSL
hsl(53, 80%, 90%)
HSB
hsb(53, 16%, 98%)
CMYK
cmyk(0%, 2%, 16%, 2%)
Oklch
oklch(96.5% 0.046 100.5)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2D2633
2B3225

Analogous

252532
2D2633
322531

Triadic

2D2633
322C25
25322C

Split-Comp.

2D2633
313225
253225

Tetradic

2D2633
322525
2B3225
253132

Contrast Matrix WCAG 2.1 Contrast

2D2633
6C3FF4
74A6E3
3FF2AB
FAF5D2
—
2.5
Fail
5.8
AA
10.1
AAA
13.3
AAA
2.5
Fail
—
2.3
Fail
4.0
AA Large
5.2
AA
5.8
AA
2.3
Fail
—
1.7
Fail
2.3
Fail
10.1
AAA
4.0
AA Large
1.7
Fail
—
1.3
Fail
13.3
AAA
5.2
AA
2.3
Fail
1.3
Fail
—
White BG
14.6AAA
5.7AA
2.5Fail
1.4Fail
1.1Fail
Black BG
1.4Fail
3.7AA Large
8.3AAA
14.5AAA
19.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2A2A30
5958C8
8A8AD4
8D8EBC
F8F8DA

Deuteranopia

2A2B2F
5B5FBE
8783D1
8275C0
F8F9DD

Tritanopia

2D2D2D
6AA69E
76C9C6
48CACD
FAE1E3

Achromatopsia

2A2A2A
616161
9E9E9E
B4B4B4
F3F3F3

Shades & Tints Shades & Tints

#2D2633

Dark
Light

#6C3FF4

Dark
Light

#74A6E3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2d2633;
  --color-2: #6c3ff4;
  --color-3: #74a6e3;
  --color-4: #3ff2ab;
  --color-5: #faf5d2;
}

SCSS

$color-1: #2d2633;
$color-2: #6c3ff4;
$color-3: #74a6e3;
$color-4: #3ff2ab;
$color-5: #faf5d2;

TAILWIND

colors: {
  'brand-1': '#2d2633',
  'brand-2': '#6c3ff4',
  'brand-3': '#74a6e3',
  'brand-4': '#3ff2ab',
  'brand-5': '#faf5d2',
}

RGB Array

[45, 38, 51], [108, 63, 244], [116, 166, 227], [63, 242, 171], [250, 245, 210]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2D2633, #6C3FF4, #74A6E3, #3FF2AB, #FAF5D2 is ideal for: social media posters, mobile apps, e-commerce promos, 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: #2d2633; --color-2: #6c3ff4; --color-3: #74a6e3; --color-4: #3ff2ab; --color-5: #faf5d2. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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