← Back to Editor

#ABC7CB · #C39D8A · #710B16 · #2C2723 · #835B28

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#ABC7CB

Sky Blue · LightSteelBlue · Lake Green

HEX
#ABC7CB
RGB
rgb(171, 199, 203)
HSL
hsl(187, 24%, 73%)
HSB
hsb(187, 16%, 80%)
CMYK
cmyk(16%, 2%, 0%, 20%)
Oklch
oklch(81.0% 0.031 207.0)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#C39D8A

Apricot · Tan · Warm Sun

HEX
#C39D8A
RGB
rgb(195, 157, 138)
HSL
hsl(20, 32%, 65%)
HSB
hsb(20, 29%, 76%)
CMYK
cmyk(0%, 19%, 29%, 24%)
Oklch
oklch(72.6% 0.053 48.0)

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

#710B16

Vermilion · Maroon · Wine Red

HEX
#710B16
RGB
rgb(113, 11, 22)
HSL
hsl(354, 82%, 24%)
HSB
hsb(354, 90%, 44%)
CMYK
cmyk(0%, 90%, 81%, 56%)
Oklch
oklch(35.3% 0.133 23.3)

Traditional「Vermilion」· Paint「Wine Red」· Creative Blush Sunrise

#2C2723

Tangerine · DarkSlateGray · Cinnamon

HEX
#2C2723
RGB
rgb(44, 39, 35)
HSL
hsl(27, 11%, 15%)
HSB
hsb(27, 20%, 17%)
CMYK
cmyk(0%, 11%, 20%, 83%)
Oklch
oklch(27.7% 0.010 61.0)

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

#835B28

Ochre · Sienna · Amber Brown

HEX
#835B28
RGB
rgb(131, 91, 40)
HSL
hsl(34, 53%, 34%)
HSB
hsb(34, 69%, 51%)
CMYK
cmyk(0%, 31%, 69%, 49%)
Oklch
oklch(50.4% 0.085 70.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ABC7CB
CBADAA

Analogous

AACBBE
ABC7CB
AAB6CB

Triadic

ABC7CB
CBAAC7
C7CBAA

Split-Comp.

ABC7CB
CBAAB6
CBBEAA

Tetradic

ABC7CB
BEAACB
CBADAA
B6CBAA

Contrast Matrix WCAG 2.1 Contrast

ABC7CB
C39D8A
710B16
2C2723
835B28
—
1.4
Fail
6.7
AA
8.3
AAA
3.4
AA Large
1.4
Fail
—
4.8
AA
6.0
AA
2.4
Fail
6.7
AA
4.8
AA
—
1.2
Fail
2.0
Fail
8.3
AAA
6.0
AA
1.2
Fail
—
2.5
Fail
3.4
AA Large
2.4
Fail
2.0
Fail
2.5
Fail
—
White BG
1.8Fail
2.5Fail
11.9AAA
14.8AAA
6.0AA
Black BG
11.8AAA
8.5AAA
1.8Fail
1.4Fail
3.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

B7B7CA
B3B28F
454413
2A2A24
727134

Deuteranopia

B6B3CA
B5B890
4B5213
2A2B24
747737

Tritanopia

ACC9C9
C19293
6C1111
2C2525
813E40

Achromatopsia

BFBFBF
A6A6A6
2B2B2B
282828
616161

Shades & Tints Shades & Tints

#ABC7CB

Dark
Light

#C39D8A

Dark
Light

#710B16

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #abc7cb;
  --color-2: #c39d8a;
  --color-3: #710b16;
  --color-4: #2c2723;
  --color-5: #835b28;
}

SCSS

$color-1: #abc7cb;
$color-2: #c39d8a;
$color-3: #710b16;
$color-4: #2c2723;
$color-5: #835b28;

TAILWIND

colors: {
  'brand-1': '#abc7cb',
  'brand-2': '#c39d8a',
  'brand-3': '#710b16',
  'brand-4': '#2c2723',
  'brand-5': '#835b28',
}

RGB Array

[171, 199, 203], [195, 157, 138], [113, 11, 22], [44, 39, 35], [131, 91, 40]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #ABC7CB, #C39D8A, #710B16, #2C2723, #835B28 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: #abc7cb; --color-2: #c39d8a; --color-3: #710b16; --color-4: #2c2723; --color-5: #835b28. 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