← Back to Editor

#CAB485 · #ABB48C · #99AA97 · #817A84 · #C8819B

space

A 5-color space 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

#CAB485

Ginger · Tan · Sunflower

HEX
#CAB485
RGB
rgb(202, 180, 133)
HSL
hsl(41, 39%, 66%)
HSB
hsb(41, 34%, 79%)
CMYK
cmyk(0%, 11%, 34%, 21%)
Oklch
oklch(77.7% 0.067 85.7)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#ABB48C

Willow Green · DarkSeaGreen · Apple Green

HEX
#ABB48C
RGB
rgb(171, 180, 140)
HSL
hsl(74, 21%, 63%)
HSB
hsb(74, 22%, 71%)
CMYK
cmyk(5%, 0%, 22%, 29%)
Oklch
oklch(75.2% 0.056 118.1)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#99AA97

Celadon · DarkSeaGreen · Apple Green

HEX
#99AA97
RGB
rgb(153, 170, 151)
HSL
hsl(114, 10%, 63%)
HSB
hsb(114, 11%, 67%)
CMYK
cmyk(10%, 0%, 11%, 33%)
Oklch
oklch(71.9% 0.033 142.3)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#817A84

Ink Gray · Gray · Warm Gray

HEX
#817A84
RGB
rgb(129, 122, 132)
HSL
hsl(282, 4%, 50%)
HSB
hsb(282, 8%, 52%)
CMYK
cmyk(2%, 8%, 0%, 48%)
Oklch
oklch(58.9% 0.017 315.9)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#C8819B

Rouge · LightCoral · Rose Pink

HEX
#C8819B
RGB
rgb(200, 129, 155)
HSL
hsl(338, 39%, 65%)
HSB
hsb(338, 36%, 78%)
CMYK
cmyk(0%, 36%, 23%, 22%)
Oklch
oklch(68.4% 0.093 356.3)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CAB485
869CCA

Analogous

CA9386
CAB485
BECA86

Triadic

CAB485
86CAB5
B586CA

Split-Comp.

CAB485
86BECA
9386CA

Tetradic

CAB485
86CA93
869CCA
CA86BE

Contrast Matrix WCAG 2.1 Contrast

CAB485
ABB48C
99AA97
817A84
C8819B
—
1.1
Fail
1.2
Fail
2.1
Fail
1.5
Fail
1.1
Fail
—
1.1
Fail
1.9
Fail
1.4
Fail
1.2
Fail
1.1
Fail
—
1.7
Fail
1.2
Fail
2.1
Fail
1.9
Fail
1.7
Fail
—
1.4
Fail
1.5
Fail
1.4
Fail
1.2
Fail
1.4
Fail
—
White BG
2.0Fail
2.2Fail
2.5Fail
4.2AA Large
3.0Fail
Black BG
10.4AAA
9.6AAA
8.6AAA
5.1AA
7.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C0C090
AFAF96
A0A19C
7E7E82
A9A995

Deuteranopia

C2C393
AEAE98
9F9E9D
7E7F81
ADB393

Tritanopia

C9999B
AB9D9F
9A9FA0
81807F
C4908F

Achromatopsia

B5B5B5
ADADAD
A3A3A3
7D7D7D
999999

Shades & Tints Shades & Tints

#CAB485

Dark
Light

#ABB48C

Dark
Light

#99AA97

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cab485;
  --color-2: #abb48c;
  --color-3: #99aa97;
  --color-4: #817a84;
  --color-5: #c8819b;
}

SCSS

$color-1: #cab485;
$color-2: #abb48c;
$color-3: #99aa97;
$color-4: #817a84;
$color-5: #c8819b;

TAILWIND

colors: {
  'brand-1': '#cab485',
  'brand-2': '#abb48c',
  'brand-3': '#99aa97',
  'brand-4': '#817a84',
  'brand-5': '#c8819b',
}

RGB Array

[202, 180, 133], [171, 180, 140], [153, 170, 151], [129, 122, 132], [200, 129, 155]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #CAB485, #ABB48C, #99AA97, #817A84, #C8819B 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: #cab485; --color-2: #abb48c; --color-3: #99aa97; --color-4: #817a84; --color-5: #c8819b. 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 space-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