← Back to Editor

#226A83 · #7B2B9D · #C40074 · #FA2A36 · #785556

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

#226A83

Lake Blue · Teal · Mint Ice

HEX
#226A83
RGB
rgb(34, 106, 131)
HSL
hsl(195, 59%, 32%)
HSB
hsb(195, 74%, 51%)
CMYK
cmyk(74%, 19%, 0%, 49%)
Oklch
oklch(49.2% 0.080 225.3)

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

#7B2B9D

Royal Purple · DarkMagenta · Eggplant

HEX
#7B2B9D
RGB
rgb(123, 43, 157)
HSL
hsl(282, 57%, 39%)
HSB
hsb(282, 73%, 62%)
CMYK
cmyk(22%, 73%, 0%, 38%)
Oklch
oklch(46.1% 0.181 313.7)

Traditional「Royal Purple」· Paint「Eggplant」· Creative Blush Sunrise

#C40074

Rose Purple · MediumVioletRed · Camellia

HEX
#C40074
RGB
rgb(196, 0, 116)
HSL
hsl(324, 100%, 38%)
HSB
hsb(324, 100%, 77%)
CMYK
cmyk(0%, 100%, 41%, 23%)
Oklch
oklch(53.6% 0.220 354.9)

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

#FA2A36

Vermilion · Crimson · Passion Red

HEX
#FA2A36
RGB
rgb(250, 42, 54)
HSL
hsl(357, 95%, 57%)
HSB
hsb(357, 83%, 98%)
CMYK
cmyk(0%, 83%, 78%, 2%)
Oklch
oklch(63.5% 0.238 25.2)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#785556

Crimson · DimGray · Wine Red

HEX
#785556
RGB
rgb(120, 85, 86)
HSL
hsl(358, 17%, 40%)
HSB
hsb(358, 29%, 47%)
CMYK
cmyk(0%, 29%, 28%, 53%)
Oklch
oklch(48.7% 0.047 17.0)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

226A83
823A21

Analogous

21826A
226A83
213A82

Triadic

226A83
82216A
6A8221

Split-Comp.

226A83
82213A
826A21

Tetradic

226A83
6A2182
823A21
3A8221

Contrast Matrix WCAG 2.1 Contrast

226A83
7B2B9D
C40074
FA2A36
785556
—
1.3
Fail
1.0
Fail
1.6
Fail
1.1
Fail
1.3
Fail
—
1.3
Fail
2.0
Fail
1.2
Fail
1.0
Fail
1.3
Fail
—
1.5
Fail
1.1
Fail
1.6
Fail
2.0
Fail
1.5
Fail
—
1.7
Fail
1.1
Fail
1.2
Fail
1.1
Fail
1.7
Fail
—
White BG
6.1AA
7.9AAA
5.8AA
3.9AA Large
6.5AA
Black BG
3.5AA Large
2.7Fail
3.6AA Large
5.4AA
3.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

41427D
585881
6F6D58
A09E33
696956

Deuteranopia

3D387B
5D637B
7B8951
ACBC32
6B6E56

Tritanopia

267877
776C67
BA423D
F03130
765656

Achromatopsia

575757
505050
484848
6A6A6A
606060

Shades & Tints Shades & Tints

#226A83

Dark
Light

#7B2B9D

Dark
Light

#C40074

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #226a83;
  --color-2: #7b2b9d;
  --color-3: #c40074;
  --color-4: #fa2a36;
  --color-5: #785556;
}

SCSS

$color-1: #226a83;
$color-2: #7b2b9d;
$color-3: #c40074;
$color-4: #fa2a36;
$color-5: #785556;

TAILWIND

colors: {
  'brand-1': '#226a83',
  'brand-2': '#7b2b9d',
  'brand-3': '#c40074',
  'brand-4': '#fa2a36',
  'brand-5': '#785556',
}

RGB Array

[34, 106, 131], [123, 43, 157], [196, 0, 116], [250, 42, 54], [120, 85, 86]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #226A83, #7B2B9D, #C40074, #FA2A36, #785556 is ideal for: social media posters, mobile apps, e-commerce promos. 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: #226a83; --color-2: #7b2b9d; --color-3: #c40074; --color-4: #fa2a36; --color-5: #785556. 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. 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