#262525 + #FA5807 + #84E31E + #3C3B3D + #871EE3 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#262525

Ink Black · DarkSlateGray · Dark Stone

HEX

#262525

RGB

rgb(38, 37, 37)

HSL

hsl(0, 1%, 15%)

HSB

hsb(0, 3%, 15%)

CMYK

cmyk(0%, 3%, 3%, 85%)

Oklch

oklch(26.6% 0.001 17.3)

Traditional「Ink Black」· Paint「Dark Stone」· Creative Midnight Shadow

#FA5807

Tangerine · OrangeRed · Amber Brown

HEX

#FA5807

RGB

rgb(250, 88, 7)

HSL

hsl(20, 96%, 50%)

HSB

hsb(20, 97%, 98%)

CMYK

cmyk(0%, 65%, 97%, 2%)

Oklch

oklch(67.1% 0.210 39.7)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#84E31E

Grass Green · Chartreuse · Olive Green

HEX

#84E31E

RGB

rgb(132, 227, 30)

HSL

hsl(89, 78%, 50%)

HSB

hsb(89, 87%, 89%)

CMYK

cmyk(42%, 0%, 87%, 11%)

Oklch

oklch(82.5% 0.228 133.7)

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

#3C3B3D

Dark Cyan · DarkSlateGray · Dark Stone

HEX

#3C3B3D

RGB

rgb(60, 59, 61)

HSL

hsl(270, 2%, 24%)

HSB

hsb(270, 3%, 24%)

CMYK

cmyk(2%, 3%, 0%, 76%)

Oklch

oklch(35.4% 0.004 308.3)

Traditional「Dark Cyan」· Paint「Dark Stone」· Creative Midnight Shadow

#871EE3

Royal Purple · DarkOrchid · Violet

HEX

#871EE3

RGB

rgb(135, 30, 227)

HSL

hsl(272, 78%, 50%)

HSB

hsb(272, 87%, 89%)

CMYK

cmyk(41%, 87%, 0%, 11%)

Oklch

oklch(52.2% 0.260 300.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

262525

262727

Analogous

272626

262525

272626

Triadic

262525

262726

262627

Split-Comp.

262525

262726

262627

Tetradic

262525

262726

262727

262627

Contrast Matrix WCAG 2.1 Contrast

262525	FA5807	84E31E	3C3B3D	871EE3
—	4.7 AA	9.5 AAA	1.4 Fail	2.4 Fail
4.7 AA	—	2.0 Fail	3.4 AA Large	1.9 Fail
9.5 AAA	2.0 Fail	—	6.9 AA	3.9 AA Large
1.4 Fail	3.4 AA Large	6.9 AA	—	1.8 Fail
2.4 Fail	1.9 Fail	3.9 AA Large	1.8 Fail	—

White BG

15.3AAA

3.2AA Large

1.6Fail

11.1AAA

6.3AA

Black BG

1.4Fail

6.5AA

13.0AAA

1.9Fail

3.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

262625

B4B21B

ADAE4E

3C3C3D

5A59B3

Deuteranopia

262625

BDC91F

A8A159

3C3C3C

6068A8

Tritanopia

262525

F22A2D

89737C

3C3C3C

828E85

Achromatopsia

252525

7F7F7F

B0B0B0

3C3C3C

545454

Shades & Tints Shades & Tints

#262525

Dark

Light

#FA5807

Dark

Light

#84E31E

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #262525;
  --color-2: #fa5807;
  --color-3: #84e31e;
  --color-4: #3c3b3d;
  --color-5: #871ee3;
}

SCSS

$color-1: #262525;
$color-2: #fa5807;
$color-3: #84e31e;
$color-4: #3c3b3d;
$color-5: #871ee3;

TAILWIND

colors: {
  'brand-1': '#262525',
  'brand-2': '#fa5807',
  'brand-3': '#84e31e',
  'brand-4': '#3c3b3d',
  'brand-5': '#871ee3',
}

RGB Array

[38, 37, 37], [250, 88, 7], [132, 227, 30], [60, 59, 61], [135, 30, 227]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #262525, #FA5807, #84E31E, #3C3B3D, #871EE3 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: #262525; --color-2: #fa5807; --color-3: #84e31e; --color-4: #3c3b3d; --color-5: #871ee3. 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 general-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