← Back to Editor

#7C91AC · #CC8A68 · #FFB785 · #BA5A20 · #2B1311

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

#7C91AC

Azure · LightSlateGray · Navy Blue

HEX
#7C91AC
RGB
rgb(124, 145, 172)
HSL
hsl(214, 22%, 58%)
HSB
hsb(214, 28%, 67%)
CMYK
cmyk(28%, 16%, 0%, 33%)
Oklch
oklch(65.0% 0.047 254.8)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#CC8A68

Tangerine · DarkSalmon · Warm Sun

HEX
#CC8A68
RGB
rgb(204, 138, 104)
HSL
hsl(20, 50%, 60%)
HSB
hsb(20, 49%, 80%)
CMYK
cmyk(0%, 32%, 49%, 20%)
Oklch
oklch(69.2% 0.094 48.0)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#FFB785

Apricot · LightSalmon · Peach Orange

HEX
#FFB785
RGB
rgb(255, 183, 133)
HSL
hsl(25, 100%, 76%)
HSB
hsb(25, 48%, 100%)
CMYK
cmyk(0%, 28%, 48%, 0%)
Oklch
oklch(83.6% 0.106 55.5)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#BA5A20

Tangerine · Chocolate · Amber Brown

HEX
#BA5A20
RGB
rgb(186, 90, 32)
HSL
hsl(23, 71%, 43%)
HSB
hsb(23, 83%, 73%)
CMYK
cmyk(0%, 52%, 83%, 27%)
Oklch
oklch(57.6% 0.141 47.5)

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

#2B1311

Crimson · Black · Deep Berry

HEX
#2B1311
RGB
rgb(43, 19, 17)
HSL
hsl(5, 43%, 12%)
HSB
hsb(5, 60%, 17%)
CMYK
cmyk(0%, 56%, 60%, 83%)
Oklch
oklch(22.1% 0.040 25.8)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7C91AC
AB977C

Analogous

7CA8AB
7C91AC
7F7CAB

Triadic

7C91AC
AB7C91
91AB7C

Split-Comp.

7C91AC
AB7F7C
A8AB7C

Tetradic

7C91AC
AB7CA8
AB977C
7CAB7F

Contrast Matrix WCAG 2.1 Contrast

7C91AC
CC8A68
FFB785
BA5A20
2B1311
—
1.1
Fail
1.9
Fail
1.4
Fail
5.4
AA
1.1
Fail
—
1.7
Fail
1.6
Fail
6.1
AA
1.9
Fail
1.7
Fail
—
2.7
Fail
10.3
AAA
1.4
Fail
1.6
Fail
2.7
Fail
—
3.8
AA Large
5.4
AA
6.1
AA
10.3
AAA
3.8
AA Large
—
White BG
3.2AA Large
2.8Fail
1.7Fail
4.6AA
17.4AAA
Black BG
6.5AA
7.4AAA
12.4AAA
4.6AA
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8585A5
AFAF70
E0DF91
90902E
212011

Deuteranopia

8482A4
B3B872
E4E994
969D31
222412

Tritanopia

7DA09F
C97778
FB9B9D
B5393C
2A1212

Achromatopsia

8E8E8E
9A9A9A
C7C7C7
707070
1A1A1A

Shades & Tints Shades & Tints

#7C91AC

Dark
Light

#CC8A68

Dark
Light

#FFB785

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7c91ac;
  --color-2: #cc8a68;
  --color-3: #ffb785;
  --color-4: #ba5a20;
  --color-5: #2b1311;
}

SCSS

$color-1: #7c91ac;
$color-2: #cc8a68;
$color-3: #ffb785;
$color-4: #ba5a20;
$color-5: #2b1311;

TAILWIND

colors: {
  'brand-1': '#7c91ac',
  'brand-2': '#cc8a68',
  'brand-3': '#ffb785',
  'brand-4': '#ba5a20',
  'brand-5': '#2b1311',
}

RGB Array

[124, 145, 172], [204, 138, 104], [255, 183, 133], [186, 90, 32], [43, 19, 17]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7C91AC, #CC8A68, #FFB785, #BA5A20, #2B1311 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: #7c91ac; --color-2: #cc8a68; --color-3: #ffb785; --color-4: #ba5a20; --color-5: #2b1311. 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