← Back to Editor

#CAB797 · #D18083 · #A35F97 · #542F78 · #261E58

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

#CAB797

Ginger · Tan · Warm Sun

HEX
#CAB797
RGB
rgb(202, 183, 151)
HSL
hsl(38, 32%, 69%)
HSB
hsb(38, 25%, 79%)
CMYK
cmyk(0%, 9%, 25%, 21%)
Oklch
oklch(78.7% 0.049 80.7)

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

#D18083

Peach Pink · LightCoral · Coral Red

HEX
#D18083
RGB
rgb(209, 128, 131)
HSL
hsl(358, 47%, 66%)
HSB
hsb(358, 39%, 82%)
CMYK
cmyk(0%, 39%, 37%, 18%)
Oklch
oklch(68.6% 0.101 17.6)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#A35F97

Rose Purple · Gray · Violet

HEX
#A35F97
RGB
rgb(163, 95, 151)
HSL
hsl(311, 27%, 51%)
HSB
hsb(311, 42%, 64%)
CMYK
cmyk(0%, 42%, 7%, 36%)
Oklch
oklch(58.1% 0.115 333.7)

Traditional「Rose Purple」· Paint「Violet」· Creative Blush Sunrise

#542F78

Dark Plum · DarkSlateBlue · Eggplant

HEX
#542F78
RGB
rgb(84, 47, 120)
HSL
hsl(270, 44%, 33%)
HSB
hsb(270, 61%, 47%)
CMYK
cmyk(30%, 61%, 0%, 53%)
Oklch
oklch(38.9% 0.122 304.7)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#261E58

Deep Indigo · MidnightBlue · Prussian Blue

HEX
#261E58
RGB
rgb(38, 30, 88)
HSL
hsl(248, 49%, 23%)
HSB
hsb(248, 66%, 35%)
CMYK
cmyk(57%, 66%, 0%, 65%)
Oklch
oklch(28.3% 0.100 284.2)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CAB797
97A9C9

Analogous

C99D97
CAB797
C3C997

Triadic

CAB797
97C9B7
B797C9

Split-Comp.

CAB797
97C3C9
9D97C9

Tetradic

CAB797
97C99D
97A9C9
C997C3

Contrast Matrix WCAG 2.1 Contrast

CAB797
D18083
A35F97
542F78
261E58
—
1.5
Fail
2.3
Fail
5.2
AA
7.6
AAA
1.5
Fail
—
1.5
Fail
3.5
AA Large
5.1
AA
2.3
Fail
1.5
Fail
—
2.3
Fail
3.3
AA Large
5.2
AA
3.5
AA Large
2.3
Fail
—
1.5
Fail
7.6
AAA
5.1
AA
3.3
AA Large
1.5
Fail
—
White BG
2.0Fail
2.9Fail
4.5AA
10.2AAA
14.9AAA
Black BG
10.7AAA
7.1AAA
4.6AA
2.1Fail
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

C2C29F
AEAD82
868589
444466
23224A

Deuteranopia

C3C4A1
B3B982
8A8F86
464962
232447

Tritanopia

C9A5A6
CD8282
A07F7C
525855
263F3C

Achromatopsia

B9B9B9
999999
7A7A7A
424242
272727

Shades & Tints Shades & Tints

#CAB797

Dark
Light

#D18083

Dark
Light

#A35F97

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cab797;
  --color-2: #d18083;
  --color-3: #a35f97;
  --color-4: #542f78;
  --color-5: #261e58;
}

SCSS

$color-1: #cab797;
$color-2: #d18083;
$color-3: #a35f97;
$color-4: #542f78;
$color-5: #261e58;

TAILWIND

colors: {
  'brand-1': '#cab797',
  'brand-2': '#d18083',
  'brand-3': '#a35f97',
  'brand-4': '#542f78',
  'brand-5': '#261e58',
}

RGB Array

[202, 183, 151], [209, 128, 131], [163, 95, 151], [84, 47, 120], [38, 30, 88]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CAB797, #D18083, #A35F97, #542F78, #261E58 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: #cab797; --color-2: #d18083; --color-3: #a35f97; --color-4: #542f78; --color-5: #261e58. 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