#C0CAB3 + #C7EC6A + #F5F3ED + #F7E2D7 + #FBA296 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C0CAB3

Willow Green · Silver · Apple Green

HEX

#C0CAB3

RGB

rgb(192, 202, 179)

HSL

hsl(86, 18%, 75%)

HSB

hsb(86, 11%, 79%)

CMYK

cmyk(5%, 0%, 11%, 21%)

Oklch

oklch(82.5% 0.033 126.3)

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

#C7EC6A

Willow Green · Khaki · Apple Green

HEX

#C7EC6A

RGB

rgb(199, 236, 106)

HSL

hsl(77, 77%, 67%)

HSB

hsb(77, 55%, 93%)

CMYK

cmyk(16%, 0%, 55%, 7%)

Oklch

oklch(89.0% 0.162 123.0)

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

#F5F3ED

Goose Yellow · Linen · Lemon Cream

HEX

#F5F3ED

RGB

rgb(245, 243, 237)

HSL

hsl(45, 29%, 95%)

HSB

hsb(45, 3%, 96%)

CMYK

cmyk(0%, 1%, 3%, 4%)

Oklch

oklch(96.4% 0.008 91.5)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#F7E2D7

Apricot · Beige · Peach Orange

HEX

#F7E2D7

RGB

rgb(247, 226, 215)

HSL

hsl(21, 67%, 91%)

HSB

hsb(21, 13%, 97%)

CMYK

cmyk(0%, 9%, 13%, 3%)

Oklch

oklch(92.7% 0.028 49.6)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#FBA296

Peach Pink · LightSalmon · Coral Red

HEX

#FBA296

RGB

rgb(251, 162, 150)

HSL

hsl(7, 93%, 79%)

HSB

hsb(7, 40%, 98%)

CMYK

cmyk(0%, 35%, 40%, 2%)

Oklch

oklch(79.8% 0.108 28.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C0CAB3

BEB4CB

Analogous

CBC9B4

C0CAB3

B5CBB4

Triadic

C0CAB3

B4C1CB

CBB4C1

Split-Comp.

C0CAB3

B4B5CB

C9B4CB

Tetradic

C0CAB3

B4CBC9

BEB4CB

CBB4B5

Contrast Matrix WCAG 2.1 Contrast

C0CAB3	C7EC6A	F5F3ED	F7E2D7	FBA296
—	1.3 Fail	1.5 Fail	1.4 Fail	1.2 Fail
1.3 Fail	—	1.2 Fail	1.1 Fail	1.5 Fail
1.5 Fail	1.2 Fail	—	1.1 Fail	1.8 Fail
1.4 Fail	1.1 Fail	1.1 Fail	—	1.6 Fail
1.2 Fail	1.5 Fail	1.8 Fail	1.6 Fail	—

White BG

1.7Fail

1.3Fail

1.1Fail

1.2Fail

2.0Fail

Black BG

12.3AAA

15.6AAA

18.9AAA

16.8AAA

10.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C4C4B9

D7D789

F4F4EE

EEEEDA

D4D499

Deuteranopia

C4C3BA

D5D291

F4F4EF

EFF1DA

DAE09A

Tritanopia

C0BDBE

C9A2A8

F5F0F0

F6DCDC

F79B9C

Achromatopsia

C4C4C4

D2D2D2

F3F3F3

E7E7E7

BBBBBB

Shades & Tints Shades & Tints

#C0CAB3

Dark

Light

#C7EC6A

Dark

Light

#F5F3ED

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c0cab3;
  --color-2: #c7ec6a;
  --color-3: #f5f3ed;
  --color-4: #f7e2d7;
  --color-5: #fba296;
}

SCSS

$color-1: #c0cab3;
$color-2: #c7ec6a;
$color-3: #f5f3ed;
$color-4: #f7e2d7;
$color-5: #fba296;

TAILWIND

colors: {
  'brand-1': '#c0cab3',
  'brand-2': '#c7ec6a',
  'brand-3': '#f5f3ed',
  'brand-4': '#f7e2d7',
  'brand-5': '#fba296',
}

RGB Array

[192, 202, 179], [199, 236, 106], [245, 243, 237], [247, 226, 215], [251, 162, 150]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C0CAB3, #C7EC6A, #F5F3ED, #F7E2D7, #FBA296 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: #c0cab3; --color-2: #c7ec6a; --color-3: #f5f3ed; --color-4: #f7e2d7; --color-5: #fba296. 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