← Back to Editor

#9B41B0 · #A48D94 · #BDBE9C · #CFD961 · #FCF64E

bright

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#9B41B0

Dark Plum · DarkOrchid · Violet

HEX
#9B41B0
RGB
rgb(155, 65, 176)
HSL
hsl(289, 46%, 47%)
HSB
hsb(289, 63%, 69%)
CMYK
cmyk(12%, 63%, 0%, 31%)
Oklch
oklch(54.1% 0.184 319.6)

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

#A48D94

Dark Violet · DarkGray · Rose Pink

HEX
#A48D94
RGB
rgb(164, 141, 148)
HSL
hsl(342, 11%, 60%)
HSB
hsb(342, 14%, 64%)
CMYK
cmyk(0%, 14%, 10%, 36%)
Oklch
oklch(66.6% 0.029 357.6)

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

#BDBE9C

Fresh Green · Tan · Sunflower

HEX
#BDBE9C
RGB
rgb(189, 190, 156)
HSL
hsl(62, 21%, 68%)
HSB
hsb(62, 18%, 75%)
CMYK
cmyk(1%, 0%, 18%, 25%)
Oklch
oklch(79.2% 0.046 108.8)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#CFD961

Fresh Green · BurlyWood · Sunflower

HEX
#CFD961
RGB
rgb(207, 217, 97)
HSL
hsl(65, 61%, 62%)
HSB
hsb(65, 55%, 85%)
CMYK
cmyk(5%, 0%, 55%, 15%)
Oklch
oklch(85.4% 0.144 113.4)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#FCF64E

Fresh Green · Khaki · Sunflower

HEX
#FCF64E
RGB
rgb(252, 246, 78)
HSL
hsl(58, 97%, 65%)
HSB
hsb(58, 69%, 99%)
CMYK
cmyk(0%, 2%, 69%, 1%)
Oklch
oklch(95.0% 0.180 107.3)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9B41B0
55AF41

Analogous

6441AF
9B41B0
AF418C

Triadic

9B41B0
AF9B41
41AF9B

Split-Comp.

9B41B0
8CAF41
41AF64

Tetradic

9B41B0
AF6441
55AF41
418CAF

Contrast Matrix WCAG 2.1 Contrast

9B41B0
A48D94
BDBE9C
CFD961
FCF64E
—
1.8
Fail
2.9
Fail
3.6
AA Large
4.9
AA
1.8
Fail
—
1.6
Fail
2.0
Fail
2.7
Fail
2.9
Fail
1.6
Fail
—
1.2
Fail
1.7
Fail
3.6
AA Large
2.0
Fail
1.2
Fail
—
1.3
Fail
4.9
AA
2.7
Fail
1.7
Fail
1.3
Fail
—
White BG
5.6AA
3.1AA Large
1.9Fail
1.5Fail
1.1Fail
Black BG
3.8AA Large
6.8AA
11.0AAA
13.8AAA
18.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

747395
9A9A92
BDBDA4
D3D37E
F9F977

Deuteranopia

79808F
9B9D92
BDBDA6
D3D285
FAFA80

Tritanopia

97807B
A39191
BDABAC
CF959A
FC979E

Achromatopsia

696969
959595
BABABA
C8C8C8
E5E5E5

Shades & Tints Shades & Tints

#9B41B0

Dark
Light

#A48D94

Dark
Light

#BDBE9C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9b41b0;
  --color-2: #a48d94;
  --color-3: #bdbe9c;
  --color-4: #cfd961;
  --color-5: #fcf64e;
}

SCSS

$color-1: #9b41b0;
$color-2: #a48d94;
$color-3: #bdbe9c;
$color-4: #cfd961;
$color-5: #fcf64e;

TAILWIND

colors: {
  'brand-1': '#9b41b0',
  'brand-2': '#a48d94',
  'brand-3': '#bdbe9c',
  'brand-4': '#cfd961',
  'brand-5': '#fcf64e',
}

RGB Array

[155, 65, 176], [164, 141, 148], [189, 190, 156], [207, 217, 97], [252, 246, 78]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #9B41B0, #A48D94, #BDBE9C, #CFD961, #FCF64E is ideal for: corporate websites, product showcases, portfolios. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #9b41b0; --color-2: #a48d94; --color-3: #bdbe9c; --color-4: #cfd961; --color-5: #fcf64e. 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 bright-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. 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