#C2E5D1 + #FEFFD6 + #F8EAC5 + #E2D0BC + #B0A2AF - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C2E5D1

Celadon · LightGray · Mint Green

HEX

#C2E5D1

RGB

rgb(194, 229, 209)

HSL

hsl(146, 40%, 83%)

HSB

hsb(146, 15%, 90%)

CMYK

cmyk(15%, 0%, 9%, 10%)

Oklch

oklch(89.1% 0.046 160.3)

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

#FEFFD6

Fresh Green · LightYellow · Lemon Cream

HEX

#FEFFD6

RGB

rgb(254, 255, 214)

HSL

hsl(61, 100%, 92%)

HSB

hsb(61, 16%, 100%)

CMYK

cmyk(0%, 0%, 16%, 0%)

Oklch

oklch(98.9% 0.053 108.5)

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

#F8EAC5

Goose Yellow · Bisque · Lemon Cream

HEX

#F8EAC5

RGB

rgb(248, 234, 197)

HSL

hsl(44, 78%, 87%)

HSB

hsb(44, 21%, 97%)

CMYK

cmyk(0%, 6%, 21%, 3%)

Oklch

oklch(93.9% 0.051 89.8)

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

#E2D0BC

Goose Yellow · Wheat · Peach Orange

HEX

#E2D0BC

RGB

rgb(226, 208, 188)

HSL

hsl(32, 40%, 81%)

HSB

hsb(32, 17%, 89%)

CMYK

cmyk(0%, 8%, 17%, 11%)

Oklch

oklch(86.7% 0.034 70.3)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#B0A2AF

Mauve · DarkGray · Silver Sand

HEX

#B0A2AF

RGB

rgb(176, 162, 175)

HSL

hsl(304, 8%, 66%)

HSB

hsb(304, 8%, 69%)

CMYK

cmyk(0%, 8%, 1%, 31%)

Oklch

oklch(72.8% 0.024 328.0)

Traditional「Mauve」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C2E5D1

E5C2D6

Analogous

C5E5C2

C2E5D1

C2E5E3

Triadic

C2E5D1

D1C2E5

E5D1C2

Split-Comp.

C2E5D1

E3C2E5

E5C2C5

Tetradic

C2E5D1

C2C5E5

E5C2D6

E5E3C2

Contrast Matrix WCAG 2.1 Contrast

C2E5D1	FEFFD6	F8EAC5	E2D0BC	B0A2AF
—	1.3 Fail	1.1 Fail	1.1 Fail	1.8 Fail
1.3 Fail	—	1.2 Fail	1.5 Fail	2.4 Fail
1.1 Fail	1.2 Fail	—	1.3 Fail	2.0 Fail
1.1 Fail	1.5 Fail	1.3 Fail	—	1.6 Fail
1.8 Fail	2.4 Fail	2.0 Fail	1.6 Fail	—

White BG

1.4Fail

1.0Fail

1.2Fail

1.5Fail

2.4Fail

Black BG

15.4AAA

20.5AAA

17.6AAA

14.0AAA

8.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D1D1D6

FEFEE0

F2F2CE

DADAC1

AAAAAC

Deuteranopia

CFCDD7

FEFEE2

F3F4D0

DBDDC2

ABACAB

Tritanopia

C4DADB

FEE8E9

F7D5D7

E1C5C6

AFA9A9

Achromatopsia

D8D8D8

FAFAFA

EAEAEA

D3D3D3

A8A8A8

Shades & Tints Shades & Tints

#C2E5D1

Dark

Light

#FEFFD6

Dark

Light

#F8EAC5

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c2e5d1;
  --color-2: #feffd6;
  --color-3: #f8eac5;
  --color-4: #e2d0bc;
  --color-5: #b0a2af;
}

SCSS

$color-1: #c2e5d1;
$color-2: #feffd6;
$color-3: #f8eac5;
$color-4: #e2d0bc;
$color-5: #b0a2af;

TAILWIND

colors: {
  'brand-1': '#c2e5d1',
  'brand-2': '#feffd6',
  'brand-3': '#f8eac5',
  'brand-4': '#e2d0bc',
  'brand-5': '#b0a2af',
}

RGB Array

[194, 229, 209], [254, 255, 214], [248, 234, 197], [226, 208, 188], [176, 162, 175]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C2E5D1, #FEFFD6, #F8EAC5, #E2D0BC, #B0A2AF 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: #c2e5d1; --color-2: #feffd6; --color-3: #f8eac5; --color-4: #e2d0bc; --color-5: #b0a2af. 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