#FFF997 + #EEE997 + #DDD997 + #CBC997 + #BAB997 · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FFF997

Fresh Green · Khaki · Lemon Cream

HEX

#FFF997

RGB

rgb(255, 249, 151)

HSL

hsl(57, 100%, 80%)

HSB

hsb(57, 41%, 100%)

CMYK

cmyk(0%, 2%, 41%, 0%)

Oklch

oklch(96.6% 0.120 105.4)

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

#EEE997

Fresh Green · Khaki · Lemon Cream

HEX

#EEE997

RGB

rgb(238, 233, 151)

HSL

hsl(57, 72%, 76%)

HSB

hsb(57, 37%, 93%)

CMYK

cmyk(0%, 2%, 37%, 7%)

Oklch

oklch(92.0% 0.103 105.2)

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

#DDD997

Fresh Green · Khaki · Sunflower

HEX

#DDD997

RGB

rgb(221, 217, 151)

HSL

hsl(57, 51%, 73%)

HSB

hsb(57, 32%, 87%)

CMYK

cmyk(0%, 2%, 32%, 13%)

Oklch

oklch(87.3% 0.085 105.1)

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

#CBC997

Fresh Green · Tan · Sunflower

HEX

#CBC997

RGB

rgb(203, 201, 151)

HSL

hsl(58, 33%, 69%)

HSB

hsb(58, 26%, 80%)

CMYK

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

Oklch

oklch(82.5% 0.066 105.9)

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

#BAB997

Fresh Green · Tan · Sunflower

HEX

#BAB997

RGB

rgb(186, 185, 151)

HSL

hsl(58, 20%, 66%)

HSB

hsb(58, 19%, 73%)

CMYK

cmyk(0%, 1%, 19%, 27%)

Oklch

oklch(77.8% 0.046 106.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFF997

999EFF

Analogous

FFC799

FFF997

D1FF99

Triadic

FFF997

99FFFA

FA99FF

Split-Comp.

FFF997

99D1FF

C799FF

Tetradic

FFF997

99FFC7

999EFF

FF99D1

Contrast Matrix WCAG 2.1 Contrast

FFF997	EEE997	DDD997	CBC997	BAB997
—	1.2 Fail	1.3 Fail	1.6 Fail	1.8 Fail
1.2 Fail	—	1.2 Fail	1.4 Fail	1.6 Fail
1.3 Fail	1.2 Fail	—	1.2 Fail	1.4 Fail
1.6 Fail	1.4 Fail	1.2 Fail	—	1.2 Fail
1.8 Fail	1.6 Fail	1.4 Fail	1.2 Fail	—

White BG

1.1Fail

1.3Fail

1.5Fail

1.7Fail

2.0Fail

Black BG

19.2AAA

16.7AAA

14.4AAA

12.3AAA

10.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

FCFCAF

ECECAB

DBDBA7

CACAA3

BABA9F

Deuteranopia

FDFDB4

ECEDB0

DCDCAB

CACAA6

BABAA1

Tritanopia

FFC1C6

EEBBBE

DDB4B6

CBADAF

BAA6A7

Achromatopsia

F0F0F0

E1E1E1

D3D3D3

C4C4C4

B5B5B5

Shades & Tints Shades & Tints

#FFF997

Dark

Light

#EEE997

Dark

Light

#DDD997

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fff997;
  --color-2: #eee997;
  --color-3: #ddd997;
  --color-4: #cbc997;
  --color-5: #bab997;
}

SCSS

$color-1: #fff997;
$color-2: #eee997;
$color-3: #ddd997;
$color-4: #cbc997;
$color-5: #bab997;

TAILWIND

colors: {
  'brand-1': '#fff997',
  'brand-2': '#eee997',
  'brand-3': '#ddd997',
  'brand-4': '#cbc997',
  'brand-5': '#bab997',
}

RGB Array

[255, 249, 151], [238, 233, 151], [221, 217, 151], [203, 201, 151], [186, 185, 151]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #FFF997, #EEE997, #DDD997, #CBC997, #BAB997 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: #fff997; --color-2: #eee997; --color-3: #ddd997; --color-4: #cbc997; --color-5: #bab997. 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 sea-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