#F0E0C9 + #E3DBAD + #FBB287 + #CFB88C + #98C4AD · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F0E0C9

Goose Yellow · Bisque · Peach Orange

HEX

#F0E0C9

RGB

rgb(240, 224, 201)

HSL

hsl(35, 57%, 86%)

HSB

hsb(35, 16%, 94%)

CMYK

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

Oklch

oklch(91.4% 0.035 77.1)

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

#E3DBAD

Fresh Green · Wheat · Lemon Cream

HEX

#E3DBAD

RGB

rgb(227, 219, 173)

HSL

hsl(51, 49%, 78%)

HSB

hsb(51, 24%, 89%)

CMYK

cmyk(0%, 4%, 24%, 11%)

Oklch

oklch(88.6% 0.061 99.3)

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

#FBB287

Apricot · LightSalmon · Peach Orange

HEX

#FBB287

RGB

rgb(251, 178, 135)

HSL

hsl(22, 94%, 76%)

HSB

hsb(22, 46%, 98%)

CMYK

cmyk(0%, 29%, 46%, 2%)

Oklch

oklch(82.3% 0.103 51.3)

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

#CFB88C

Ginger · Tan · Warm Sun

HEX

#CFB88C

RGB

rgb(207, 184, 140)

HSL

hsl(39, 41%, 68%)

HSB

hsb(39, 32%, 81%)

CMYK

cmyk(0%, 11%, 32%, 19%)

Oklch

oklch(79.1% 0.064 83.4)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#98C4AD

Celadon · DarkGray · Apple Green

HEX

#98C4AD

RGB

rgb(152, 196, 173)

HSL

hsl(149, 27%, 68%)

HSB

hsb(149, 22%, 77%)

CMYK

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

Oklch

oklch(78.2% 0.057 162.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F0E0C9

C7D8F0

Analogous

F0CAC7

F0E0C9

ECF0C7

Triadic

F0E0C9

C7F0DF

DFC7F0

Split-Comp.

F0E0C9

C7ECF0

CAC7F0

Tetradic

F0E0C9

C7F0CA

C7D8F0

F0C7EC

Contrast Matrix WCAG 2.1 Contrast

F0E0C9	E3DBAD	FBB287	CFB88C	98C4AD
—	1.1 Fail	1.4 Fail	1.5 Fail	1.5 Fail
1.1 Fail	—	1.3 Fail	1.4 Fail	1.4 Fail
1.4 Fail	1.3 Fail	—	1.1 Fail	1.1 Fail
1.5 Fail	1.4 Fail	1.1 Fail	—	1.0 Fail
1.5 Fail	1.4 Fail	1.1 Fail	1.0 Fail	—

White BG

1.3Fail

1.4Fail

1.8Fail

1.9Fail

Black BG

16.2AAA

15.0AAA

11.8AAA

10.9AAA

10.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E9E9CF

E0DFB8

DBDB91

C5C597

ABABB3

Deuteranopia

EAEBD0

E0E1BB

E0E594

C6C899

A9A5B4

Tritanopia

EFD3D4

E3C1C3

F79A9B

CE9FA1

9AB7B8

Achromatopsia

E2E2E2

D8D8D8

C3C3C3

BABABA

B4B4B4

Shades & Tints Shades & Tints

#F0E0C9

Dark

Light

#E3DBAD

Dark

Light

#FBB287

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f0e0c9;
  --color-2: #e3dbad;
  --color-3: #fbb287;
  --color-4: #cfb88c;
  --color-5: #98c4ad;
}

SCSS

$color-1: #f0e0c9;
$color-2: #e3dbad;
$color-3: #fbb287;
$color-4: #cfb88c;
$color-5: #98c4ad;

TAILWIND

colors: {
  'brand-1': '#f0e0c9',
  'brand-2': '#e3dbad',
  'brand-3': '#fbb287',
  'brand-4': '#cfb88c',
  'brand-5': '#98c4ad',
}

RGB Array

[240, 224, 201], [227, 219, 173], [251, 178, 135], [207, 184, 140], [152, 196, 173]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #F0E0C9, #E3DBAD, #FBB287, #CFB88C, #98C4AD 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: #f0e0c9; --color-2: #e3dbad; --color-3: #fbb287; --color-4: #cfb88c; --color-5: #98c4ad. 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