← Back to Editor

#FF54B8 · #B5F631 · #FF36BE · #C8F300 · #A6E71B

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#FF54B8

Mauve · Orchid · Rose Pink

HEX
#FF54B8
RGB
rgb(255, 84, 184)
HSL
hsl(325, 100%, 66%)
HSB
hsb(325, 67%, 100%)
CMYK
cmyk(0%, 67%, 28%, 0%)
Oklch
oklch(70.7% 0.227 348.4)

Traditional「Mauve」· Paint「Rose Pink」· Creative Rose Petal

#B5F631

Grass Green · GreenYellow · Olive Green

HEX
#B5F631
RGB
rgb(181, 246, 49)
HSL
hsl(80, 92%, 58%)
HSB
hsb(80, 80%, 96%)
CMYK
cmyk(26%, 0%, 80%, 4%)
Oklch
oklch(89.7% 0.219 127.2)

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

#FF36BE

Mauve · DeepPink · Lilac Purple

HEX
#FF36BE
RGB
rgb(255, 54, 190)
HSL
hsl(319, 100%, 61%)
HSB
hsb(319, 79%, 100%)
CMYK
cmyk(0%, 79%, 25%, 0%)
Oklch
oklch(68.6% 0.261 345.0)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

#C8F300

Grass Green · GreenYellow · Olive Green

HEX
#C8F300
RGB
rgb(200, 243, 0)
HSL
hsl(71, 100%, 48%)
HSB
hsb(71, 100%, 95%)
CMYK
cmyk(18%, 0%, 100%, 5%)
Oklch
oklch(90.1% 0.218 121.7)

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

#A6E71B

Grass Green · GreenYellow · Olive Green

HEX
#A6E71B
RGB
rgb(166, 231, 27)
HSL
hsl(79, 81%, 51%)
HSB
hsb(79, 88%, 91%)
CMYK
cmyk(28%, 0%, 88%, 9%)
Oklch
oklch(85.2% 0.216 127.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF54B8
52FF9A

Analogous

F152FF
FF54B8
FF5260

Triadic

FF54B8
B7FF52
52B7FF

Split-Comp.

FF54B8
60FF52
52FFF1

Tetradic

FF54B8
FFF152
52FF9A
5260FF

Contrast Matrix WCAG 2.1 Contrast

FF54B8
B5F631
FF36BE
C8F300
A6E71B
—
2.2
Fail
1.1
Fail
2.3
Fail
2.0
Fail
2.2
Fail
—
2.5
Fail
1.0
Fail
1.2
Fail
1.1
Fail
2.5
Fail
—
2.5
Fail
2.2
Fail
2.3
Fail
1.0
Fail
2.5
Fail
—
1.2
Fail
2.0
Fail
1.2
Fail
2.2
Fail
1.2
Fail
—
White BG
2.9Fail
1.3Fail
3.2AA Large
1.3Fail
1.5Fail
Black BG
7.2AAA
16.2AAA
6.5AA
16.3AAA
14.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B5B3A0
D1D261
A8A69D
DBDB3B
C2C34C

Deuteranopia

BFCC9A
CDC96C
B4C395
D8D549
BEBA58

Tritanopia

F68D89
B8868F
F5837D
CA6973
A9737C

Achromatopsia

939393
CCCCCC
828282
CACACA
BCBCBC

Shades & Tints Shades & Tints

#FF54B8

Dark
Light

#B5F631

Dark
Light

#FF36BE

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff54b8;
  --color-2: #b5f631;
  --color-3: #ff36be;
  --color-4: #c8f300;
  --color-5: #a6e71b;
}

SCSS

$color-1: #ff54b8;
$color-2: #b5f631;
$color-3: #ff36be;
$color-4: #c8f300;
$color-5: #a6e71b;

TAILWIND

colors: {
  'brand-1': '#ff54b8',
  'brand-2': '#b5f631',
  'brand-3': '#ff36be',
  'brand-4': '#c8f300',
  'brand-5': '#a6e71b',
}

RGB Array

[255, 84, 184], [181, 246, 49], [255, 54, 190], [200, 243, 0], [166, 231, 27]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FF54B8, #B5F631, #FF36BE, #C8F300, #A6E71B 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: #ff54b8; --color-2: #b5f631; --color-3: #ff36be; --color-4: #c8f300; --color-5: #a6e71b. 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