← Back to Editor

#C7AB8F · #33242A · #94355B · #9E471B · #AB612C

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#C7AB8F

Ginger · Tan · Warm Sun

HEX
#C7AB8F
RGB
rgb(199, 171, 143)
HSL
hsl(30, 33%, 67%)
HSB
hsb(30, 28%, 78%)
CMYK
cmyk(0%, 14%, 28%, 22%)
Oklch
oklch(75.9% 0.051 66.9)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#33242A

Dark Violet · DarkSlateGray · Raspberry

HEX
#33242A
RGB
rgb(51, 36, 42)
HSL
hsl(336, 17%, 17%)
HSB
hsb(336, 29%, 20%)
CMYK
cmyk(0%, 29%, 18%, 80%)
Oklch
oklch(28.1% 0.025 353.0)

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

#94355B

Dark Violet · Brown · Camellia

HEX
#94355B
RGB
rgb(148, 53, 91)
HSL
hsl(336, 47%, 39%)
HSB
hsb(336, 64%, 58%)
CMYK
cmyk(0%, 64%, 39%, 42%)
Oklch
oklch(47.5% 0.133 358.7)

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

#9E471B

Tangerine · Sienna · Amber Brown

HEX
#9E471B
RGB
rgb(158, 71, 27)
HSL
hsl(20, 71%, 36%)
HSB
hsb(20, 83%, 62%)
CMYK
cmyk(0%, 55%, 83%, 38%)
Oklch
oklch(50.4% 0.128 44.2)

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

#AB612C

Tangerine · Sienna · Amber Brown

HEX
#AB612C
RGB
rgb(171, 97, 44)
HSL
hsl(25, 59%, 42%)
HSB
hsb(25, 74%, 67%)
CMYK
cmyk(0%, 43%, 74%, 33%)
Oklch
oklch(56.8% 0.117 53.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C7AB8F
8FABC7

Analogous

C78F8F
C7AB8F
C7C78F

Triadic

C7AB8F
8FC7AB
AB8FC7

Split-Comp.

C7AB8F
8FC7C7
8F8FC7

Tetradic

C7AB8F
8FC78F
8FABC7
C78FC7

Contrast Matrix WCAG 2.1 Contrast

C7AB8F
33242A
94355B
9E471B
AB612C
—
6.8
AA
3.3
AA Large
2.9
Fail
2.2
Fail
6.8
AA
—
2.0
Fail
2.4
Fail
3.1
AA Large
3.3
AA Large
2.0
Fail
—
1.2
Fail
1.5
Fail
2.9
Fail
2.4
Fail
1.2
Fail
—
1.3
Fail
2.2
Fail
3.1
AA Large
1.5
Fail
1.3
Fail
—
White BG
2.2Fail
14.7AAA
7.2AAA
6.2AA
4.7AA
Black BG
9.7AAA
1.4Fail
2.9Fail
3.4AA Large
4.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

BBBB96
2D2C29
6B6A52
787826
8B8A39

Deuteranopia

BDBF97
2D2E28
707850
7D8428
8F953C

Tritanopia

C69B9C
322727
8F4B49
9A2E30
A74345

Achromatopsia

B0B0B0
292929
565656
5C5C5C
717171

Shades & Tints Shades & Tints

#C7AB8F

Dark
Light

#33242A

Dark
Light

#94355B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c7ab8f;
  --color-2: #33242a;
  --color-3: #94355b;
  --color-4: #9e471b;
  --color-5: #ab612c;
}

SCSS

$color-1: #c7ab8f;
$color-2: #33242a;
$color-3: #94355b;
$color-4: #9e471b;
$color-5: #ab612c;

TAILWIND

colors: {
  'brand-1': '#c7ab8f',
  'brand-2': '#33242a',
  'brand-3': '#94355b',
  'brand-4': '#9e471b',
  'brand-5': '#ab612c',
}

RGB Array

[199, 171, 143], [51, 36, 42], [148, 53, 91], [158, 71, 27], [171, 97, 44]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C7AB8F, #33242A, #94355B, #9E471B, #AB612C is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #c7ab8f; --color-2: #33242a; --color-3: #94355b; --color-4: #9e471b; --color-5: #ab612c. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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