#D0BFA3 + #F7E3CA + #D2DCC4 + #92C1B1 + #F4D4A3 · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D0BFA3

Goose Yellow · Tan · Warm Sun

HEX

#D0BFA3

RGB

rgb(208, 191, 163)

HSL

hsl(37, 32%, 73%)

HSB

hsb(37, 22%, 82%)

CMYK

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

Oklch

oklch(81.2% 0.043 80.3)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#F7E3CA

Goose Yellow · Bisque · Peach Orange

HEX

#F7E3CA

RGB

rgb(247, 227, 202)

HSL

hsl(33, 74%, 88%)

HSB

hsb(33, 18%, 97%)

CMYK

cmyk(0%, 8%, 18%, 3%)

Oklch

oklch(92.5% 0.040 73.4)

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

#D2DCC4

Willow Green · LightGray · Mint Green

HEX

#D2DCC4

RGB

rgb(210, 220, 196)

HSL

hsl(85, 26%, 82%)

HSB

hsb(85, 11%, 86%)

CMYK

cmyk(5%, 0%, 11%, 14%)

Oklch

oklch(88.0% 0.034 125.6)

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

#92C1B1

Jade · DarkGray · Lake Green

HEX

#92C1B1

RGB

rgb(146, 193, 177)

HSL

hsl(160, 27%, 66%)

HSB

hsb(160, 24%, 76%)

CMYK

cmyk(24%, 0%, 8%, 24%)

Oklch

oklch(77.3% 0.055 171.9)

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

#F4D4A3

Goose Yellow · Wheat · Peach Orange

HEX

#F4D4A3

RGB

rgb(244, 212, 163)

HSL

hsl(36, 79%, 80%)

HSB

hsb(36, 33%, 96%)

CMYK

cmyk(0%, 13%, 33%, 4%)

Oklch

oklch(88.5% 0.073 78.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D0BFA3

A4B5D0

Analogous

D0A9A4

D0BFA3

CBD0A4

Triadic

D0BFA3

A4D0BF

BFA4D0

Split-Comp.

D0BFA3

A4CBD0

A9A4D0

Tetradic

D0BFA3

A4D0A9

A4B5D0

D0A4CB

Contrast Matrix WCAG 2.1 Contrast

D0BFA3	F7E3CA	D2DCC4	92C1B1	F4D4A3
—	1.4 Fail	1.3 Fail	1.1 Fail	1.3 Fail
1.4 Fail	—	1.1 Fail	1.6 Fail	1.1 Fail
1.3 Fail	1.1 Fail	—	1.4 Fail	1.0 Fail
1.1 Fail	1.6 Fail	1.4 Fail	—	1.4 Fail
1.3 Fail	1.1 Fail	1.0 Fail	1.4 Fail	—

White BG

1.8Fail

1.3Fail

1.4Fail

2.0Fail

1.4Fail

Black BG

11.7AAA

16.8AAA

14.8AAA

10.5AAA

14.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C9C8AA

EEEED0

D6D6CA

A6A7B5

E6E6AF

Deuteranopia

CACBAB

F0F1D1

D6D5CB

A4A0B6

E8EAB2

Tritanopia

CFAFB0

F6D5D6

D3CECF

94B8B9

F2B8BA

Achromatopsia

C1C1C1

E6E6E6

D6D6D6

B1B1B1

D8D8D8

Shades & Tints Shades & Tints

#D0BFA3

Dark

Light

#F7E3CA

Dark

Light

#D2DCC4

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d0bfa3;
  --color-2: #f7e3ca;
  --color-3: #d2dcc4;
  --color-4: #92c1b1;
  --color-5: #f4d4a3;
}

SCSS

$color-1: #d0bfa3;
$color-2: #f7e3ca;
$color-3: #d2dcc4;
$color-4: #92c1b1;
$color-5: #f4d4a3;

TAILWIND

colors: {
  'brand-1': '#d0bfa3',
  'brand-2': '#f7e3ca',
  'brand-3': '#d2dcc4',
  'brand-4': '#92c1b1',
  'brand-5': '#f4d4a3',
}

RGB Array

[208, 191, 163], [247, 227, 202], [210, 220, 196], [146, 193, 177], [244, 212, 163]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #D0BFA3, #F7E3CA, #D2DCC4, #92C1B1, #F4D4A3 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: #d0bfa3; --color-2: #f7e3ca; --color-3: #d2dcc4; --color-4: #92c1b1; --color-5: #f4d4a3. 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