← Back to Editor

#26354C · #643053 · #BA285C · #F04863 · #F1CD66

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

#26354C

Indigo · DarkSlateGray · Prussian Blue

HEX
#26354C
RGB
rgb(38, 53, 76)
HSL
hsl(216, 33%, 22%)
HSB
hsb(216, 50%, 30%)
CMYK
cmyk(50%, 30%, 0%, 70%)
Oklch
oklch(32.7% 0.046 258.7)

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

#643053

Rose Purple · DimGray · Camellia

HEX
#643053
RGB
rgb(100, 48, 83)
HSL
hsl(320, 35%, 29%)
HSB
hsb(320, 52%, 39%)
CMYK
cmyk(0%, 52%, 17%, 61%)
Oklch
oklch(39.1% 0.089 341.2)

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

#BA285C

Dark Violet · MediumVioletRed · Camellia

HEX
#BA285C
RGB
rgb(186, 40, 92)
HSL
hsl(339, 65%, 44%)
HSB
hsb(339, 78%, 73%)
CMYK
cmyk(0%, 78%, 51%, 27%)
Oklch
oklch(52.7% 0.184 5.3)

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

#F04863

Peach Pink · Tomato · Coral Red

HEX
#F04863
RGB
rgb(240, 72, 99)
HSL
hsl(350, 85%, 61%)
HSB
hsb(350, 70%, 94%)
CMYK
cmyk(0%, 70%, 59%, 6%)
Oklch
oklch(64.8% 0.203 15.9)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#F1CD66

Ginger · SandyBrown · Sunflower

HEX
#F1CD66
RGB
rgb(241, 205, 102)
HSL
hsl(44, 83%, 67%)
HSB
hsb(44, 58%, 95%)
CMYK
cmyk(0%, 15%, 58%, 5%)
Oklch
oklch(85.9% 0.128 90.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

26354C
4B3C26

Analogous

26474B
26354C
29264B

Triadic

26354C
4B2634
344B26

Split-Comp.

26354C
4B2926
474B26

Tetradic

26354C
4B2647
4B3C26
264B29

Contrast Matrix WCAG 2.1 Contrast

26354C
643053
BA285C
F04863
F1CD66
—
1.2
Fail
2.1
Fail
3.4
AA Large
8.1
AAA
1.2
Fail
—
1.7
Fail
2.8
Fail
6.5
AA
2.1
Fail
1.7
Fail
—
1.6
Fail
3.9
AA Large
3.4
AA Large
2.8
Fail
1.6
Fail
—
2.4
Fail
8.1
AAA
6.5
AA
3.9
AA Large
2.4
Fail
—
White BG
12.4AAA
10.0AAA
5.9AA
3.6AA Large
1.5Fail
Black BG
1.7Fail
2.1Fail
3.5AA Large
5.8AA
13.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2C2D46
4D4D4B
7B794F
A7A65C
E1E17F

Deuteranopia

2C2B45
515449
838E4C
B1BE5B
E4E685

Tritanopia

274241
614442
B34543
E85756
EF9397

Achromatopsia

333333
444444
5A5A5A
7D7D7D
CCCCCC

Shades & Tints Shades & Tints

#26354C

Dark
Light

#643053

Dark
Light

#BA285C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #26354c;
  --color-2: #643053;
  --color-3: #ba285c;
  --color-4: #f04863;
  --color-5: #f1cd66;
}

SCSS

$color-1: #26354c;
$color-2: #643053;
$color-3: #ba285c;
$color-4: #f04863;
$color-5: #f1cd66;

TAILWIND

colors: {
  'brand-1': '#26354c',
  'brand-2': '#643053',
  'brand-3': '#ba285c',
  'brand-4': '#f04863',
  'brand-5': '#f1cd66',
}

RGB Array

[38, 53, 76], [100, 48, 83], [186, 40, 92], [240, 72, 99], [241, 205, 102]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #26354C, #643053, #BA285C, #F04863, #F1CD66 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: #26354c; --color-2: #643053; --color-3: #ba285c; --color-4: #f04863; --color-5: #f1cd66. 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