← Back to Editor

#063A45 · #833355 · #BA1354 · #F51B7D · #3C8898

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

#063A45

Lake Blue · DarkSlateGray · Peacock Green

HEX
#063A45
RGB
rgb(6, 58, 69)
HSL
hsl(190, 84%, 15%)
HSB
hsb(190, 91%, 27%)
CMYK
cmyk(91%, 16%, 0%, 73%)
Oklch
oklch(32.2% 0.054 216.3)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#833355

Dark Violet · Brown · Camellia

HEX
#833355
RGB
rgb(131, 51, 85)
HSL
hsl(335, 44%, 36%)
HSB
hsb(335, 61%, 51%)
CMYK
cmyk(0%, 61%, 35%, 49%)
Oklch
oklch(44.3% 0.116 356.4)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#BA1354

Dark Violet · Crimson · Camellia

HEX
#BA1354
RGB
rgb(186, 19, 84)
HSL
hsl(337, 81%, 40%)
HSB
hsb(337, 90%, 73%)
CMYK
cmyk(0%, 90%, 55%, 27%)
Oklch
oklch(51.3% 0.197 6.6)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#F51B7D

Dark Violet · DeepPink · Rose Pink

HEX
#F51B7D
RGB
rgb(245, 27, 125)
HSL
hsl(333, 92%, 53%)
HSB
hsb(333, 89%, 96%)
CMYK
cmyk(0%, 89%, 49%, 4%)
Oklch
oklch(63.3% 0.245 2.5)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#3C8898

Slate Blue · SteelBlue · Mint Ice

HEX
#3C8898
RGB
rgb(60, 136, 152)
HSL
hsl(190, 43%, 42%)
HSB
hsb(190, 61%, 60%)
CMYK
cmyk(61%, 11%, 0%, 40%)
Oklch
oklch(58.6% 0.078 213.6)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

063A45
461106

Analogous

064631
063A45
061C46

Triadic

063A45
46063C
3C4606

Split-Comp.

063A45
46061C
463106

Tetradic

063A45
310646
461106
1C4606

Contrast Matrix WCAG 2.1 Contrast

063A45
833355
BA1354
F51B7D
3C8898
—
1.5
Fail
1.9
Fail
3.1
AA Large
3.0
AA Large
1.5
Fail
—
1.3
Fail
2.1
Fail
2.0
Fail
1.9
Fail
1.3
Fail
—
1.6
Fail
1.6
Fail
3.1
AA Large
2.1
Fail
1.6
Fail
—
1.0
Fail
3.0
AA Large
2.0
Fail
1.6
Fail
1.0
Fail
—
White BG
12.4AAA
8.2AAA
6.3AA
3.9AA Large
4.1AA Large
Black BG
1.7Fail
2.6Fail
3.3AA Large
5.3AA
5.2AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

1D1D42
60604D
727044
979565
5D5E94

Deuteranopia

1A1642
656B4B
7B8841
A3B460
595393

Tritanopia

094040
7F4645
B23835
EA534E
409190

Achromatopsia

2C2C2C
4F4F4F
4C4C4C
676767
737373

Shades & Tints Shades & Tints

#063A45

Dark
Light

#833355

Dark
Light

#BA1354

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #063a45;
  --color-2: #833355;
  --color-3: #ba1354;
  --color-4: #f51b7d;
  --color-5: #3c8898;
}

SCSS

$color-1: #063a45;
$color-2: #833355;
$color-3: #ba1354;
$color-4: #f51b7d;
$color-5: #3c8898;

TAILWIND

colors: {
  'brand-1': '#063a45',
  'brand-2': '#833355',
  'brand-3': '#ba1354',
  'brand-4': '#f51b7d',
  'brand-5': '#3c8898',
}

RGB Array

[6, 58, 69], [131, 51, 85], [186, 19, 84], [245, 27, 125], [60, 136, 152]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #063A45, #833355, #BA1354, #F51B7D, #3C8898 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: #063a45; --color-2: #833355; --color-3: #ba1354; --color-4: #f51b7d; --color-5: #3c8898. 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