← Back to Editor

#C06F55 · #F07D55 · #9C6455 · #725755 · #4A4C55

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 Library

Color Details Color Details

#C06F55

Tangerine · Chocolate · Warm Sun

HEX
#C06F55
RGB
rgb(192, 111, 85)
HSL
hsl(15, 46%, 54%)
HSB
hsb(15, 56%, 75%)
CMYK
cmyk(0%, 42%, 56%, 25%)
Oklch
oklch(62.6% 0.110 38.5)

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

#F07D55

Apricot · Coral · Warm Sun

HEX
#F07D55
RGB
rgb(240, 125, 85)
HSL
hsl(15, 84%, 64%)
HSB
hsb(15, 65%, 94%)
CMYK
cmyk(0%, 48%, 65%, 6%)
Oklch
oklch(71.2% 0.152 39.6)

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

#9C6455

Crimson · Sienna · Passion Red

HEX
#9C6455
RGB
rgb(156, 100, 85)
HSL
hsl(13, 29%, 47%)
HSB
hsb(13, 46%, 61%)
CMYK
cmyk(0%, 36%, 46%, 39%)
Oklch
oklch(56.0% 0.077 35.7)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#725755

Crimson · DimGray · Wine Red

HEX
#725755
RGB
rgb(114, 87, 85)
HSL
hsl(4, 15%, 39%)
HSB
hsb(4, 25%, 45%)
CMYK
cmyk(0%, 24%, 25%, 55%)
Oklch
oklch(48.4% 0.036 23.4)

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

#4A4C55

Ink Gray · DarkSlateGray · Charcoal

HEX
#4A4C55
RGB
rgb(74, 76, 85)
HSL
hsl(229, 7%, 31%)
HSB
hsb(229, 13%, 33%)
CMYK
cmyk(13%, 11%, 0%, 67%)
Oklch
oklch(41.8% 0.015 275.8)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C06F55
54A5C0

Analogous

C0546F
C06F55
C0A554

Triadic

C06F55
54C06F
6F54C0

Split-Comp.

C06F55
54C0A5
546FC0

Tetradic

C06F55
6FC054
54A5C0
A554C0

Contrast Matrix WCAG 2.1 Contrast

C06F55
F07D55
9C6455
725755
4A4C55
—
1.4
Fail
1.3
Fail
1.8
Fail
2.3
Fail
1.4
Fail
—
1.8
Fail
2.4
Fail
3.2
AA Large
1.3
Fail
1.8
Fail
—
1.4
Fail
1.8
Fail
1.8
Fail
2.4
Fail
1.4
Fail
—
1.3
Fail
2.3
Fail
3.2
AA Large
1.8
Fail
1.3
Fail
—
White BG
3.7AA Large
2.7Fail
4.8AA
6.5AA
8.6AAA
Black BG
5.6AA
7.8AAA
4.4AA Large
3.2AA Large
2.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

9D9C5B
BEBD5F
848359
666655
4B4B53

Deuteranopia

A2A85D
C5CE61
878B5A
686A56
4B4B52

Tritanopia

BC6061
EA6668
995B5C
715656
4A5151

Achromatopsia

848484
9B9B9B
737373
5F5F5F
4C4C4C

Shades & Tints Shades & Tints

#C06F55

Dark
Light

#F07D55

Dark
Light

#9C6455

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c06f55;
  --color-2: #f07d55;
  --color-3: #9c6455;
  --color-4: #725755;
  --color-5: #4a4c55;
}

SCSS

$color-1: #c06f55;
$color-2: #f07d55;
$color-3: #9c6455;
$color-4: #725755;
$color-5: #4a4c55;

TAILWIND

colors: {
  'brand-1': '#c06f55',
  'brand-2': '#f07d55',
  'brand-3': '#9c6455',
  'brand-4': '#725755',
  'brand-5': '#4a4c55',
}

RGB Array

[192, 111, 85], [240, 125, 85], [156, 100, 85], [114, 87, 85], [74, 76, 85]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C06F55, #F07D55, #9C6455, #725755, #4A4C55 is ideal for: corporate websites, product showcases, portfolios. 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: #c06f55; --color-2: #f07d55; --color-3: #9c6455; --color-4: #725755; --color-5: #4a4c55. 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. 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