#ABC203 + #855A60 + #5C5768 + #703453 + #85005F · bright - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#ABC203

Autumn Sage · DarkGoldenRod · Honey Gold

HEX

#ABC203

RGB

rgb(171, 194, 3)

HSL

hsl(67, 97%, 39%)

HSB

hsb(67, 98%, 76%)

CMYK

cmyk(12%, 0%, 98%, 24%)

Oklch

oklch(77.0% 0.179 118.0)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#855A60

Crimson · DimGray · Passion Red

HEX

#855A60

RGB

rgb(133, 90, 96)

HSL

hsl(352, 19%, 44%)

HSB

hsb(352, 32%, 52%)

CMYK

cmyk(0%, 32%, 28%, 48%)

Oklch

oklch(51.6% 0.057 10.1)

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

#5C5768

Deep Indigo · DimGray · Charcoal

HEX

#5C5768

RGB

rgb(92, 87, 104)

HSL

hsl(258, 9%, 37%)

HSB

hsb(258, 16%, 41%)

CMYK

cmyk(12%, 16%, 0%, 59%)

Oklch

oklch(46.8% 0.028 298.8)

Traditional「Deep Indigo」· Paint「Charcoal」· Creative Midnight Shadow

#703453

Rose Purple · DimGray · Camellia

HEX

#703453

RGB

rgb(112, 52, 83)

HSL

hsl(329, 37%, 32%)

HSB

hsb(329, 54%, 44%)

CMYK

cmyk(0%, 54%, 26%, 56%)

Oklch

oklch(41.5% 0.093 349.7)

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

#85005F

Rose Purple · Purple · Eggplant

HEX

#85005F

RGB

rgb(133, 0, 95)

HSL

hsl(317, 100%, 26%)

HSB

hsb(317, 100%, 52%)

CMYK

cmyk(0%, 100%, 29%, 48%)

Oklch

oklch(41.1% 0.174 345.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ABC203

1903C4

Analogous

C47A03

ABC203

4DC403

Triadic

ABC203

03ADC4

C403AD

Split-Comp.

ABC203

034DC4

7A03C4

Tetradic

ABC203

03C47A

1903C4

C4034D

Contrast Matrix WCAG 2.1 Contrast

ABC203	855A60	5C5768	703453	85005F
—	2.9 Fail	3.5 AA Large	4.5 AA	4.8 AA
2.9 Fail	—	1.2 Fail	1.6 Fail	1.7 Fail
3.5 AA Large	1.2 Fail	—	1.3 Fail	1.4 Fail
4.5 AA	1.6 Fail	1.3 Fail	—	1.1 Fail
4.8 AA	1.7 Fail	1.4 Fail	1.1 Fail	—

White BG

2.0Fail

5.8AA

7.0AA

9.1AAA

9.7AAA

Black BG

10.4AAA

3.6AA Large

3.0AA Large

2.3Fail

2.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B5B531

72725F

5A5A64

56554B

4B4A48

Deuteranopia

B4B23C

75785E

5A5A63

5A5E4A

535D43

Tritanopia

AC565E

835D5D

5C6160

6D4644

7E3632

Achromatopsia

A5A5A5

686868

5A5A5A

494949

333333

Shades & Tints Shades & Tints

#ABC203

Dark

Light

#855A60

Dark

Light

#5C5768

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #abc203;
  --color-2: #855a60;
  --color-3: #5c5768;
  --color-4: #703453;
  --color-5: #85005f;
}

SCSS

$color-1: #abc203;
$color-2: #855a60;
$color-3: #5c5768;
$color-4: #703453;
$color-5: #85005f;

TAILWIND

colors: {
  'brand-1': '#abc203',
  'brand-2': '#855a60',
  'brand-3': '#5c5768',
  'brand-4': '#703453',
  'brand-5': '#85005f',
}

RGB Array

[171, 194, 3], [133, 90, 96], [92, 87, 104], [112, 52, 83], [133, 0, 95]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #ABC203, #855A60, #5C5768, #703453, #85005F is ideal for: tech websites, dark mode UIs, game UIs. 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: #abc203; --color-2: #855a60; --color-3: #5c5768; --color-4: #703453; --color-5: #85005f. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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