← Back to Editor

#656B6B · #6B911F · #D15824 · #C4166A · #043263

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

#656B6B

Ink Gray · DimGray · Warm Gray

HEX
#656B6B
RGB
rgb(101, 107, 107)
HSL
hsl(180, 3%, 41%)
HSB
hsb(180, 6%, 42%)
CMYK
cmyk(6%, 0%, 0%, 58%)
Oklch
oklch(52.3% 0.007 196.9)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#6B911F

Grass Green · Olive · Forest Green

HEX
#6B911F
RGB
rgb(107, 145, 31)
HSL
hsl(80, 65%, 35%)
HSB
hsb(80, 79%, 57%)
CMYK
cmyk(26%, 0%, 79%, 43%)
Oklch
oklch(60.7% 0.144 126.9)

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

#D15824

Tangerine · Chocolate · Amber Brown

HEX
#D15824
RGB
rgb(209, 88, 36)
HSL
hsl(18, 71%, 48%)
HSB
hsb(18, 83%, 82%)
CMYK
cmyk(0%, 58%, 83%, 18%)
Oklch
oklch(60.8% 0.166 41.2)

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

#C4166A

Dark Violet · MediumVioletRed · Camellia

HEX
#C4166A
RGB
rgb(196, 22, 106)
HSL
hsl(331, 80%, 43%)
HSB
hsb(331, 89%, 77%)
CMYK
cmyk(0%, 89%, 46%, 23%)
Oklch
oklch(53.9% 0.208 359.7)

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

#043263

Indigo · MidnightBlue · Deep Sea Blue

HEX
#043263
RGB
rgb(4, 50, 99)
HSL
hsl(211, 92%, 20%)
HSB
hsb(211, 96%, 39%)
CMYK
cmyk(96%, 49%, 0%, 61%)
Oklch
oklch(31.9% 0.098 254.5)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

656B6B
6C6565

Analogous

656C69
656B6B
65696C

Triadic

656B6B
6C656C
6C6C65

Split-Comp.

656B6B
6C6569
6C6965

Tetradic

656B6B
69656C
6C6565
696C65

Contrast Matrix WCAG 2.1 Contrast

656B6B
6B911F
D15824
C4166A
043263
—
1.5
Fail
1.3
Fail
1.1
Fail
2.4
Fail
1.5
Fail
—
1.1
Fail
1.6
Fail
3.5
AA Large
1.3
Fail
1.1
Fail
—
1.4
Fail
3.1
AA Large
1.1
Fail
1.6
Fail
1.4
Fail
—
2.2
Fail
2.4
Fail
3.5
AA Large
3.1
AA Large
2.2
Fail
—
White BG
5.4AA
3.7AA Large
4.1AA Large
5.7AA
12.8AAA
Black BG
3.9AA Large
5.7AA
5.1AA
3.7AA Large
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

68686B
7B7C3B
9D9C31
797756
181857

Deuteranopia

67676B
797641
A4AD34
839051
151254

Tritanopia

656B6B
6D5055
CB3B3D
BB4642
064E4C

Achromatopsia

696969
797979
767676
545454
2A2A2A

Shades & Tints Shades & Tints

#656B6B

Dark
Light

#6B911F

Dark
Light

#D15824

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #656b6b;
  --color-2: #6b911f;
  --color-3: #d15824;
  --color-4: #c4166a;
  --color-5: #043263;
}

SCSS

$color-1: #656b6b;
$color-2: #6b911f;
$color-3: #d15824;
$color-4: #c4166a;
$color-5: #043263;

TAILWIND

colors: {
  'brand-1': '#656b6b',
  'brand-2': '#6b911f',
  'brand-3': '#d15824',
  'brand-4': '#c4166a',
  'brand-5': '#043263',
}

RGB Array

[101, 107, 107], [107, 145, 31], [209, 88, 36], [196, 22, 106], [4, 50, 99]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #656B6B, #6B911F, #D15824, #C4166A, #043263 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs. 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: #656b6b; --color-2: #6b911f; --color-3: #d15824; --color-4: #c4166a; --color-5: #043263. 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 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