#F1E5AB + #EAD4A3 + #CABA98 + #A0A994 + #5A7481 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F1E5AB

Fresh Green · Wheat · Lemon Cream

HEX

#F1E5AB

RGB

rgb(241, 229, 171)

HSL

hsl(50, 71%, 81%)

HSB

hsb(50, 29%, 95%)

CMYK

cmyk(0%, 5%, 29%, 5%)

Oklch

oklch(91.8% 0.076 97.8)

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

#EAD4A3

Goose Yellow · Wheat · Lemon Cream

HEX

#EAD4A3

RGB

rgb(234, 212, 163)

HSL

hsl(41, 63%, 78%)

HSB

hsb(41, 30%, 92%)

CMYK

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

Oklch

oklch(87.6% 0.068 86.6)

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

#CABA98

Ginger · Tan · Sunflower

HEX

#CABA98

RGB

rgb(202, 186, 152)

HSL

hsl(41, 32%, 69%)

HSB

hsb(41, 25%, 79%)

CMYK

cmyk(0%, 8%, 25%, 21%)

Oklch

oklch(79.4% 0.049 85.8)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#A0A994

Willow Green · DarkGray · Apple Green

HEX

#A0A994

RGB

rgb(160, 169, 148)

HSL

hsl(86, 11%, 62%)

HSB

hsb(86, 12%, 66%)

CMYK

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

Oklch

oklch(72.2% 0.031 126.1)

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

#5A7481

Slate Blue · SlateGray · Navy Blue

HEX

#5A7481

RGB

rgb(90, 116, 129)

HSL

hsl(200, 18%, 43%)

HSB

hsb(200, 30%, 51%)

CMYK

cmyk(30%, 10%, 0%, 49%)

Oklch

oklch(54.3% 0.037 229.9)

Traditional「Slate Blue」· Paint「Navy Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F1E5AB

ACB8F1

Analogous

F1C3AC

F1E5AB

DAF1AC

Triadic

F1E5AB

ACF1E5

E5ACF1

Split-Comp.

F1E5AB

ACDAF1

C3ACF1

Tetradic

F1E5AB

ACF1C3

ACB8F1

F1ACDA

Contrast Matrix WCAG 2.1 Contrast

F1E5AB	EAD4A3	CABA98	A0A994	5A7481
—	1.1 Fail	1.5 Fail	1.9 Fail	3.9 AA Large
1.1 Fail	—	1.3 Fail	1.7 Fail	3.4 AA Large
1.5 Fail	1.3 Fail	—	1.3 Fail	2.6 Fail
1.9 Fail	1.7 Fail	1.3 Fail	—	2.0 Fail
3.9 AA Large	3.4 AA Large	2.6 Fail	2.0 Fail	—

White BG

1.3Fail

1.5Fail

1.9Fail

2.4Fail

4.9AA

Black BG

16.5AAA

14.4AAA

11.0AAA

8.6AAA

4.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

ECECB9

E0E0AF

C3C3A0

A4A499

65657E

Deuteranopia

EDEDBC

E2E3B2

C4C5A2

A3A39A

64627D

Tritanopia

F0C4C7

E9B8BA

C9A7A8

A09D9E

5B7B7B

Achromatopsia

E2E2E2

D5D5D5

BBBBBB

A4A4A4

6E6E6E

Shades & Tints Shades & Tints

#F1E5AB

Dark

Light

#EAD4A3

Dark

Light

#CABA98

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f1e5ab;
  --color-2: #ead4a3;
  --color-3: #caba98;
  --color-4: #a0a994;
  --color-5: #5a7481;
}

SCSS

$color-1: #f1e5ab;
$color-2: #ead4a3;
$color-3: #caba98;
$color-4: #a0a994;
$color-5: #5a7481;

TAILWIND

colors: {
  'brand-1': '#f1e5ab',
  'brand-2': '#ead4a3',
  'brand-3': '#caba98',
  'brand-4': '#a0a994',
  'brand-5': '#5a7481',
}

RGB Array

[241, 229, 171], [234, 212, 163], [202, 186, 152], [160, 169, 148], [90, 116, 129]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #F1E5AB, #EAD4A3, #CABA98, #A0A994, #5A7481 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: #f1e5ab; --color-2: #ead4a3; --color-3: #caba98; --color-4: #a0a994; --color-5: #5a7481. 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 cool-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