← Back to Editor

#8DA763 · #7A6CF8 · #880BDD · #F1AA88 · #0BC9DD

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

#8DA763

Grass Green · DarkSeaGreen · Olive Green

HEX
#8DA763
RGB
rgb(141, 167, 99)
HSL
hsl(83, 28%, 52%)
HSB
hsb(83, 41%, 65%)
CMYK
cmyk(16%, 0%, 41%, 35%)
Oklch
oklch(69.2% 0.097 125.9)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#7A6CF8

Wisteria · MediumSlateBlue · Cobalt Blue

HEX
#7A6CF8
RGB
rgb(122, 108, 248)
HSL
hsl(246, 91%, 70%)
HSB
hsb(246, 56%, 97%)
CMYK
cmyk(51%, 56%, 0%, 3%)
Oklch
oklch(61.7% 0.202 283.3)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#880BDD

Royal Purple · DarkViolet · Violet

HEX
#880BDD
RGB
rgb(136, 11, 221)
HSL
hsl(276, 91%, 45%)
HSB
hsb(276, 95%, 87%)
CMYK
cmyk(38%, 95%, 0%, 13%)
Oklch
oklch(51.0% 0.263 303.1)

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

#F1AA88

Apricot · LightSalmon · Warm Sun

HEX
#F1AA88
RGB
rgb(241, 170, 136)
HSL
hsl(19, 79%, 74%)
HSB
hsb(19, 44%, 95%)
CMYK
cmyk(0%, 29%, 44%, 5%)
Oklch
oklch(79.8% 0.096 46.5)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#0BC9DD

Lake Blue · DarkTurquoise · Mint Ice

HEX
#0BC9DD
RGB
rgb(11, 201, 221)
HSL
hsl(186, 91%, 45%)
HSB
hsb(186, 95%, 87%)
CMYK
cmyk(95%, 9%, 0%, 13%)
Oklch
oklch(76.5% 0.130 207.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8DA763
7D62A7

Analogous

A79F62
8DA763
6AA762

Triadic

8DA763
628DA7
A7628D

Split-Comp.

8DA763
626AA7
9F62A7

Tetradic

8DA763
62A79F
7D62A7
A7626A

Contrast Matrix WCAG 2.1 Contrast

8DA763
7A6CF8
880BDD
F1AA88
0BC9DD
—
1.5
Fail
2.5
Fail
1.4
Fail
1.3
Fail
1.5
Fail
—
1.7
Fail
2.0
Fail
2.0
Fail
2.5
Fail
1.7
Fail
—
3.5
AA Large
3.3
AA Large
1.4
Fail
2.0
Fail
3.5
AA Large
—
1.0
Fail
1.3
Fail
2.0
Fail
3.3
AA Large
1.0
Fail
—
White BG
2.7Fail
3.9AA Large
6.7AA
1.9Fail
2.0Fail
Black BG
7.8AAA
5.3AA
3.1AA Large
10.8AAA
10.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

989873
7474D6
5251AA
D2D290
5D5FD8

Deuteranopia

979577
7576CE
59629E
D6DC92
5244D7

Tritanopia

8E8083
79BBB6
828279
ED9798
15D4D4

Achromatopsia

979797
808080
484848
BBBBBB
929292

Shades & Tints Shades & Tints

#8DA763

Dark
Light

#7A6CF8

Dark
Light

#880BDD

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8da763;
  --color-2: #7a6cf8;
  --color-3: #880bdd;
  --color-4: #f1aa88;
  --color-5: #0bc9dd;
}

SCSS

$color-1: #8da763;
$color-2: #7a6cf8;
$color-3: #880bdd;
$color-4: #f1aa88;
$color-5: #0bc9dd;

TAILWIND

colors: {
  'brand-1': '#8da763',
  'brand-2': '#7a6cf8',
  'brand-3': '#880bdd',
  'brand-4': '#f1aa88',
  'brand-5': '#0bc9dd',
}

RGB Array

[141, 167, 99], [122, 108, 248], [136, 11, 221], [241, 170, 136], [11, 201, 221]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8DA763, #7A6CF8, #880BDD, #F1AA88, #0BC9DD 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: #8da763; --color-2: #7a6cf8; --color-3: #880bdd; --color-4: #f1aa88; --color-5: #0bc9dd. 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