#CAB1AA + #D29497 + #CE7B83 + #F1A29E + #FFC2BA - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#CAB1AA

Peach Pink · Silver · Coral Red

HEX

#CAB1AA

RGB

rgb(202, 177, 170)

HSL

hsl(13, 23%, 73%)

HSB

hsb(13, 16%, 79%)

CMYK

cmyk(0%, 12%, 16%, 21%)

Oklch

oklch(78.0% 0.031 36.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#D29497

Peach Pink · Tan · Coral Red

HEX

#D29497

RGB

rgb(210, 148, 151)

HSL

hsl(357, 41%, 70%)

HSB

hsb(357, 30%, 82%)

CMYK

cmyk(0%, 30%, 28%, 18%)

Oklch

oklch(72.8% 0.075 15.9)

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

#CE7B83

Peach Pink · LightCoral · Coral Red

HEX

#CE7B83

RGB

rgb(206, 123, 131)

HSL

hsl(354, 46%, 65%)

HSB

hsb(354, 40%, 81%)

CMYK

cmyk(0%, 40%, 36%, 19%)

Oklch

oklch(67.4% 0.104 14.0)

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

#F1A29E

Peach Pink · BurlyWood · Coral Red

HEX

#F1A29E

RGB

rgb(241, 162, 158)

HSL

hsl(3, 75%, 78%)

HSB

hsb(3, 34%, 95%)

CMYK

cmyk(0%, 33%, 34%, 5%)

Oklch

oklch(78.9% 0.095 22.6)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#FFC2BA

Peach Pink · LightPink · Cherry Blossom

HEX

#FFC2BA

RGB

rgb(255, 194, 186)

HSL

hsl(7, 100%, 86%)

HSB

hsb(7, 27%, 100%)

CMYK

cmyk(0%, 24%, 27%, 0%)

Oklch

oklch(86.7% 0.071 27.1)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CAB1AA

AAC3CA

Analogous

CAAAB3

CAB1AA

CAC1AA

Triadic

CAB1AA

AACAB1

B1AACA

Split-Comp.

CAB1AA

AACAC1

AAB3CA

Tetradic

CAB1AA

B3CAAA

AAC3CA

C1AACA

Contrast Matrix WCAG 2.1 Contrast

CAB1AA	D29497	CE7B83	F1A29E	FFC2BA
—	1.2 Fail	1.5 Fail	1.0 Fail	1.3 Fail
1.2 Fail	—	1.2 Fail	1.2 Fail	1.6 Fail
1.5 Fail	1.2 Fail	—	1.5 Fail	2.0 Fail
1.0 Fail	1.2 Fail	1.5 Fail	—	1.3 Fail
1.3 Fail	1.6 Fail	2.0 Fail	1.3 Fail	—

White BG

2.0Fail

2.5Fail

3.1AA Large

2.0Fail

1.5Fail

Black BG

10.4AAA

8.4AAA

6.8AA

10.4AAA

13.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BFBFAC

B7B796

AAA981

CFCE9F

E5E4BC

Deuteranopia

C1C2AC

BBBF96

AFB581

D3D99F

E8EDBC

Tritanopia

C9ADAD

CF9696

CA807F

EDA0A0

FCBDBE

Achromatopsia

B8B8B8

A7A7A7

959595

B9B9B9

D3D3D3

Shades & Tints Shades & Tints

#CAB1AA

Dark

Light

#D29497

Dark

Light

#CE7B83

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cab1aa;
  --color-2: #d29497;
  --color-3: #ce7b83;
  --color-4: #f1a29e;
  --color-5: #ffc2ba;
}

SCSS

$color-1: #cab1aa;
$color-2: #d29497;
$color-3: #ce7b83;
$color-4: #f1a29e;
$color-5: #ffc2ba;

TAILWIND

colors: {
  'brand-1': '#cab1aa',
  'brand-2': '#d29497',
  'brand-3': '#ce7b83',
  'brand-4': '#f1a29e',
  'brand-5': '#ffc2ba',
}

RGB Array

[202, 177, 170], [210, 148, 151], [206, 123, 131], [241, 162, 158], [255, 194, 186]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CAB1AA, #D29497, #CE7B83, #F1A29E, #FFC2BA is ideal for: health products, baby brands, fresh-style blogs. 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: #cab1aa; --color-2: #d29497; --color-3: #ce7b83; --color-4: #f1a29e; --color-5: #ffc2ba. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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