← Back to Editor

#C66356 · #A23858 · #723D53 · #674D5A · #B2A9B2

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 Library

Color Details Color Details

#C66356

Crimson · Chocolate · Passion Red

HEX
#C66356
RGB
rgb(198, 99, 86)
HSL
hsl(7, 50%, 56%)
HSB
hsb(7, 57%, 78%)
CMYK
cmyk(0%, 50%, 57%, 22%)
Oklch
oklch(61.5% 0.129 29.0)

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

#A23858

Dark Violet · Brown · Camellia

HEX
#A23858
RGB
rgb(162, 56, 88)
HSL
hsl(342, 49%, 43%)
HSB
hsb(342, 65%, 64%)
CMYK
cmyk(0%, 65%, 46%, 36%)
Oklch
oklch(50.1% 0.142 5.3)

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

#723D53

Dark Violet · DimGray · Camellia

HEX
#723D53
RGB
rgb(114, 61, 83)
HSL
hsl(335, 30%, 34%)
HSB
hsb(335, 46%, 45%)
CMYK
cmyk(0%, 46%, 27%, 55%)
Oklch
oklch(43.3% 0.079 354.6)

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

#674D5A

Dark Violet · DimGray · Camellia

HEX
#674D5A
RGB
rgb(103, 77, 90)
HSL
hsl(330, 14%, 35%)
HSB
hsb(330, 25%, 40%)
CMYK
cmyk(0%, 25%, 13%, 60%)
Oklch
oklch(45.2% 0.040 347.3)

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

#B2A9B2

Ash · DarkGray · Silver Sand

HEX
#B2A9B2
RGB
rgb(178, 169, 178)
HSL
hsl(300, 6%, 68%)
HSB
hsb(300, 5%, 70%)
CMYK
cmyk(0%, 5%, 0%, 30%)
Oklch
oklch(74.5% 0.016 325.7)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C66356
57BAC7

Analogous

C75782
C66356
C79C57

Triadic

C66356
57C764
6457C7

Split-Comp.

C66356
57C79C
5782C7

Tetradic

C66356
82C757
57BAC7
9C57C7

Contrast Matrix WCAG 2.1 Contrast

C66356
A23858
723D53
674D5A
B2A9B2
—
1.6
Fail
2.1
Fail
1.9
Fail
1.7
Fail
1.6
Fail
—
1.3
Fail
1.2
Fail
2.8
Fail
2.1
Fail
1.3
Fail
—
1.1
Fail
3.7
AA Large
1.9
Fail
1.2
Fail
1.1
Fail
—
3.3
AA Large
1.7
Fail
2.8
Fail
3.7
AA Large
3.3
AA Large
—
White BG
3.9AA Large
6.5AA
8.4AAA
7.5AAA
2.3Fail
Black BG
5.3AA
3.2AA Large
2.5Fail
2.8Fail
9.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9B9A59
747350
5B5B4E
5C5C57
AEAEB0

Deuteranopia

A1A85A
7A824E
5E624C
5D5F56
AFAFAF

Tritanopia

C15C5C
9D4A49
6F4949
665454
B2AEAE

Achromatopsia

7F7F7F
5B5B5B
4F4F4F
565656
ADADAD

Shades & Tints Shades & Tints

#C66356

Dark
Light

#A23858

Dark
Light

#723D53

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c66356;
  --color-2: #a23858;
  --color-3: #723d53;
  --color-4: #674d5a;
  --color-5: #b2a9b2;
}

SCSS

$color-1: #c66356;
$color-2: #a23858;
$color-3: #723d53;
$color-4: #674d5a;
$color-5: #b2a9b2;

TAILWIND

colors: {
  'brand-1': '#c66356',
  'brand-2': '#a23858',
  'brand-3': '#723d53',
  'brand-4': '#674d5a',
  'brand-5': '#b2a9b2',
}

RGB Array

[198, 99, 86], [162, 56, 88], [114, 61, 83], [103, 77, 90], [178, 169, 178]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C66356, #A23858, #723D53, #674D5A, #B2A9B2 is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #c66356; --color-2: #a23858; --color-3: #723d53; --color-4: #674d5a; --color-5: #b2a9b2. 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. Restrained colors convey professionalism and trust. 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