#482F1B + #4F3E74 + #816E8C + #8C8F86 + #8F8607 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#482F1B

Tangerine · DarkOliveGreen · Cinnamon

HEX

#482F1B

RGB

rgb(72, 47, 27)

HSL

hsl(27, 45%, 19%)

HSB

hsb(27, 63%, 28%)

CMYK

cmyk(0%, 35%, 63%, 72%)

Oklch

oklch(33.0% 0.049 58.7)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#4F3E74

Deep Indigo · DarkSlateBlue · Prussian Blue

HEX

#4F3E74

RGB

rgb(79, 62, 116)

HSL

hsl(259, 30%, 35%)

HSB

hsb(259, 47%, 45%)

CMYK

cmyk(32%, 47%, 0%, 55%)

Oklch

oklch(40.8% 0.090 296.7)

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

#816E8C

Dark Plum · Gray · Violet

HEX

#816E8C

RGB

rgb(129, 110, 140)

HSL

hsl(278, 12%, 49%)

HSB

hsb(278, 21%, 55%)

CMYK

cmyk(8%, 21%, 0%, 45%)

Oklch

oklch(56.7% 0.051 313.1)

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

#8C8F86

Ash · Gray · Warm Gray

HEX

#8C8F86

RGB

rgb(140, 143, 134)

HSL

hsl(80, 4%, 54%)

HSB

hsb(80, 6%, 56%)

CMYK

cmyk(2%, 0%, 6%, 44%)

Oklch

oklch(64.5% 0.014 121.8)

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

#8F8607

Autumn Sage · Olive · Honey Gold

HEX

#8F8607

RGB

rgb(143, 134, 7)

HSL

hsl(56, 91%, 29%)

HSB

hsb(56, 95%, 56%)

CMYK

cmyk(0%, 6%, 95%, 44%)

Oklch

oklch(60.9% 0.127 104.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

482F1B

1B3346

Analogous

461B1D

482F1B

46441B

Triadic

482F1B

1B462E

2E1B46

Split-Comp.

482F1B

1B4644

1B1D46

Tetradic

482F1B

1D461B

1B3346

441B46

Contrast Matrix WCAG 2.1 Contrast

482F1B	4F3E74	816E8C	8C8F86	8F8607
—	1.3 Fail	2.7 Fail	3.8 AA Large	3.3 AA Large
1.3 Fail	—	2.0 Fail	2.8 Fail	2.5 Fail
2.7 Fail	2.0 Fail	—	1.4 Fail	1.2 Fail
3.8 AA Large	2.8 Fail	1.4 Fail	—	1.1 Fail
3.3 AA Large	2.5 Fail	1.2 Fail	1.1 Fail	—

White BG

12.4AAA

9.2AAA

4.6AA

3.3AA Large

3.8AA Large

Black BG

1.7Fail

2.3Fail

4.5AA

6.4AA

5.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3D3D20

484767

797985

8D8D88

8B8B26

Deuteranopia

3F4121

494A64

7A7B83

8D8D89

8C8C2D

Tritanopia

472425

4E5D5A

807F7E

8C8A8A

8F3E43

Achromatopsia

343434

494949

777777

8D8D8D

7A7A7A

Shades & Tints Shades & Tints

#482F1B

Dark

Light

#4F3E74

Dark

Light

#816E8C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #482f1b;
  --color-2: #4f3e74;
  --color-3: #816e8c;
  --color-4: #8c8f86;
  --color-5: #8f8607;
}

SCSS

$color-1: #482f1b;
$color-2: #4f3e74;
$color-3: #816e8c;
$color-4: #8c8f86;
$color-5: #8f8607;

TAILWIND

colors: {
  'brand-1': '#482f1b',
  'brand-2': '#4f3e74',
  'brand-3': '#816e8c',
  'brand-4': '#8c8f86',
  'brand-5': '#8f8607',
}

RGB Array

[72, 47, 27], [79, 62, 116], [129, 110, 140], [140, 143, 134], [143, 134, 7]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #482F1B, #4F3E74, #816E8C, #8C8F86, #8F8607 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: #482f1b; --color-2: #4f3e74; --color-3: #816e8c; --color-4: #8c8f86; --color-5: #8f8607. 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