#F6E3AB + #CDE9B5 + #A3D2C0 + #94BDBB + #9C9CC6 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F6E3AB

Goose Yellow · Wheat · Lemon Cream

HEX

#F6E3AB

RGB

rgb(246, 227, 171)

HSL

hsl(45, 81%, 82%)

HSB

hsb(45, 30%, 96%)

CMYK

cmyk(0%, 8%, 30%, 4%)

Oklch

oklch(91.8% 0.075 91.5)

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

#CDE9B5

Emerald · LightGray · Mint Green

HEX

#CDE9B5

RGB

rgb(205, 233, 181)

HSL

hsl(92, 54%, 81%)

HSB

hsb(92, 22%, 91%)

CMYK

cmyk(12%, 0%, 22%, 9%)

Oklch

oklch(90.0% 0.075 130.8)

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

#A3D2C0

Jade · Silver · Apple Green

HEX

#A3D2C0

RGB

rgb(163, 210, 192)

HSL

hsl(157, 34%, 73%)

HSB

hsb(157, 22%, 82%)

CMYK

cmyk(22%, 0%, 9%, 18%)

Oklch

oklch(82.5% 0.055 169.5)

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

#94BDBB

Jade · DarkGray · Lake Green

HEX

#94BDBB

RGB

rgb(148, 189, 187)

HSL

hsl(177, 24%, 66%)

HSB

hsb(177, 22%, 74%)

CMYK

cmyk(22%, 0%, 1%, 26%)

Oklch

oklch(76.8% 0.044 192.6)

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

#9C9CC6

Wisteria · DarkGray · Cobalt Blue

HEX

#9C9CC6

RGB

rgb(156, 156, 198)

HSL

hsl(240, 27%, 69%)

HSB

hsb(240, 21%, 78%)

CMYK

cmyk(21%, 21%, 0%, 22%)

Oklch

oklch(70.8% 0.061 284.7)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F6E3AB

ACBFF6

Analogous

F6BFAC

F6E3AB

E4F6AC

Triadic

F6E3AB

ACF6E4

E4ACF6

Split-Comp.

F6E3AB

ACE4F6

BFACF6

Tetradic

F6E3AB

ACF6BF

ACBFF6

F6ACE4

Contrast Matrix WCAG 2.1 Contrast

F6E3AB	CDE9B5	A3D2C0	94BDBB	9C9CC6
—	1.0 Fail	1.3 Fail	1.6 Fail	2.1 Fail
1.0 Fail	—	1.3 Fail	1.6 Fail	2.0 Fail
1.3 Fail	1.3 Fail	—	1.2 Fail	1.6 Fail
1.6 Fail	1.6 Fail	1.2 Fail	—	1.3 Fail
2.1 Fail	2.0 Fail	1.6 Fail	1.3 Fail	—

White BG

1.3Fail

1.7Fail

2.0Fail

2.6Fail

Black BG

16.5AAA

15.9AAA

12.5AAA

10.3AAA

8.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EEEEB9

D9D9C2

B7B8C4

A6A6BB

9C9CBC

Deuteranopia

EFF0BC

D8D5C5

B5B1C5

A3A0BC

9C9CB9

Tritanopia

F5C3C6

CECCCE

A5C8C9

96BCBC

9CB4B2

Achromatopsia

E2E2E2

DBDBDB

C2C2C2

B1B1B1

A1A1A1

Shades & Tints Shades & Tints

#F6E3AB

Dark

Light

#CDE9B5

Dark

Light

#A3D2C0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f6e3ab;
  --color-2: #cde9b5;
  --color-3: #a3d2c0;
  --color-4: #94bdbb;
  --color-5: #9c9cc6;
}

SCSS

$color-1: #f6e3ab;
$color-2: #cde9b5;
$color-3: #a3d2c0;
$color-4: #94bdbb;
$color-5: #9c9cc6;

TAILWIND

colors: {
  'brand-1': '#f6e3ab',
  'brand-2': '#cde9b5',
  'brand-3': '#a3d2c0',
  'brand-4': '#94bdbb',
  'brand-5': '#9c9cc6',
}

RGB Array

[246, 227, 171], [205, 233, 181], [163, 210, 192], [148, 189, 187], [156, 156, 198]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F6E3AB, #CDE9B5, #A3D2C0, #94BDBB, #9C9CC6 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: #f6e3ab; --color-2: #cde9b5; --color-3: #a3d2c0; --color-4: #94bdbb; --color-5: #9c9cc6. 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