#C3CB97 + #FFABAB + #D4BAB6 + #B3D1C1 + #7CE0CF - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C3CB97

Fresh Green · Tan · Sunflower

HEX

#C3CB97

RGB

rgb(195, 203, 151)

HSL

hsl(69, 33%, 69%)

HSB

hsb(69, 26%, 80%)

CMYK

cmyk(4%, 0%, 26%, 20%)

Oklch

oklch(82.3% 0.070 115.1)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#FFABAB

Peach Pink · LightPink · Cherry Blossom

HEX

#FFABAB

RGB

rgb(255, 171, 171)

HSL

hsl(0, 100%, 84%)

HSB

hsb(0, 33%, 100%)

CMYK

cmyk(0%, 33%, 33%, 0%)

Oklch

oklch(82.3% 0.099 19.4)

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

#D4BAB6

Peach Pink · Silver · Coral Red

HEX

#D4BAB6

RGB

rgb(212, 186, 182)

HSL

hsl(8, 26%, 77%)

HSB

hsb(8, 14%, 83%)

CMYK

cmyk(0%, 12%, 14%, 17%)

Oklch

oklch(81.0% 0.030 28.2)

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

#B3D1C1

Celadon · Silver · Apple Green

HEX

#B3D1C1

RGB

rgb(179, 209, 193)

HSL

hsl(148, 25%, 76%)

HSB

hsb(148, 14%, 82%)

CMYK

cmyk(14%, 0%, 8%, 18%)

Oklch

oklch(83.4% 0.039 162.2)

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

#7CE0CF

Jade · SkyBlue · Lake Green

HEX

#7CE0CF

RGB

rgb(124, 224, 207)

HSL

hsl(170, 62%, 68%)

HSB

hsb(170, 45%, 88%)

CMYK

cmyk(45%, 0%, 8%, 12%)

Oklch

oklch(84.1% 0.098 181.6)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C3CB97

9E96CA

Analogous

CAB896

C3CB97

A8CA96

Triadic

C3CB97

96C2CA

CA96C2

Split-Comp.

C3CB97

96A8CA

B896CA

Tetradic

C3CB97

96CAB8

9E96CA

CA96A8

Contrast Matrix WCAG 2.1 Contrast

C3CB97	FFABAB	D4BAB6	B3D1C1	7CE0CF
—	1.1 Fail	1.1 Fail	1.0 Fail	1.1 Fail
1.1 Fail	—	1.0 Fail	1.1 Fail	1.2 Fail
1.1 Fail	1.0 Fail	—	1.1 Fail	1.2 Fail
1.0 Fail	1.1 Fail	1.1 Fail	—	1.0 Fail
1.1 Fail	1.2 Fail	1.2 Fail	1.0 Fail	—

White BG

1.7Fail

1.8Fail

1.6Fail

Black BG

12.3AAA

11.7AAA

11.5AAA

12.8AAA

13.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C6C7A4

DBDAAB

C9C9B7

C0C0C5

A7A8D3

Deuteranopia

C6C5A7

E0E6AB

CACCB7

BEBCC6

A29AD4

Tritanopia

C3AEB0

FBABAB

D3B8B8

B4C8C9

81D6D7

Achromatopsia

C3C3C3

C4C4C4

C1C1C1

C6C6C6

C0C0C0

Shades & Tints Shades & Tints

#C3CB97

Dark

Light

#FFABAB

Dark

Light

#D4BAB6

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c3cb97;
  --color-2: #ffabab;
  --color-3: #d4bab6;
  --color-4: #b3d1c1;
  --color-5: #7ce0cf;
}

SCSS

$color-1: #c3cb97;
$color-2: #ffabab;
$color-3: #d4bab6;
$color-4: #b3d1c1;
$color-5: #7ce0cf;

TAILWIND

colors: {
  'brand-1': '#c3cb97',
  'brand-2': '#ffabab',
  'brand-3': '#d4bab6',
  'brand-4': '#b3d1c1',
  'brand-5': '#7ce0cf',
}

RGB Array

[195, 203, 151], [255, 171, 171], [212, 186, 182], [179, 209, 193], [124, 224, 207]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C3CB97, #FFABAB, #D4BAB6, #B3D1C1, #7CE0CF 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: #c3cb97; --color-2: #ffabab; --color-3: #d4bab6; --color-4: #b3d1c1; --color-5: #7ce0cf. 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