#BC896F + #A8846B + #BC9B71 + #F3D2B8 + #E5BBA9 · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BC896F

Tangerine · DarkSalmon · Warm Sun

HEX

#BC896F

RGB

rgb(188, 137, 111)

HSL

hsl(20, 36%, 59%)

HSB

hsb(20, 41%, 74%)

CMYK

cmyk(0%, 27%, 41%, 26%)

Oklch

oklch(67.3% 0.073 48.1)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#A8846B

Tangerine · Gray · Warm Sun

HEX

#A8846B

RGB

rgb(168, 132, 107)

HSL

hsl(25, 26%, 54%)

HSB

hsb(25, 36%, 66%)

CMYK

cmyk(0%, 21%, 36%, 34%)

Oklch

oklch(64.1% 0.057 56.3)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#BC9B71

Ginger · Tan · Warm Sun

HEX

#BC9B71

RGB

rgb(188, 155, 113)

HSL

hsl(34, 36%, 59%)

HSB

hsb(34, 40%, 74%)

CMYK

cmyk(0%, 18%, 40%, 26%)

Oklch

oklch(70.9% 0.069 73.0)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#F3D2B8

Apricot · Wheat · Peach Orange

HEX

#F3D2B8

RGB

rgb(243, 210, 184)

HSL

hsl(26, 71%, 84%)

HSB

hsb(26, 24%, 95%)

CMYK

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

Oklch

oklch(88.5% 0.051 60.3)

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

#E5BBA9

Apricot · BurlyWood · Peach Orange

HEX

#E5BBA9

RGB

rgb(229, 187, 169)

HSL

hsl(18, 54%, 78%)

HSB

hsb(18, 26%, 90%)

CMYK

cmyk(0%, 18%, 26%, 10%)

Oklch

oklch(82.4% 0.055 44.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BC896F

71A3BC

Analogous

BC717D

BC896F

BCB071

Triadic

BC896F

71BC8A

8A71BC

Split-Comp.

BC896F

71BCB0

717DBC

Tetradic

BC896F

7DBC71

71A3BC

B071BC

Contrast Matrix WCAG 2.1 Contrast

BC896F	A8846B	BC9B71	F3D2B8	E5BBA9
—	1.1 Fail	1.2 Fail	2.1 Fail	1.7 Fail
1.1 Fail	—	1.3 Fail	2.4 Fail	1.9 Fail
1.2 Fail	1.3 Fail	—	1.8 Fail	1.5 Fail
2.1 Fail	2.4 Fail	1.8 Fail	—	1.2 Fail
1.7 Fail	1.9 Fail	1.5 Fail	1.2 Fail	—

White BG

3.0AA Large

3.4AA Large

2.6Fail

1.4Fail

1.7Fail

Black BG

6.9AA

6.2AA

8.1AAA

14.7AAA

12.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A6A575

989871

AEAD7B

E5E4BE

D3D2AD

Deuteranopia

A9AD77

9B9D73

B0B27E

E7E9C0

D5D8AE

Tritanopia

B97A7B

A67677

BA8385

F1C3C4

E3B1B2

Achromatopsia

959595

8C8C8C

A0A0A0

D9D9D9

C6C6C6

Shades & Tints Shades & Tints

#BC896F

Dark

Light

#A8846B

Dark

Light

#BC9B71

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bc896f;
  --color-2: #a8846b;
  --color-3: #bc9b71;
  --color-4: #f3d2b8;
  --color-5: #e5bba9;
}

SCSS

$color-1: #bc896f;
$color-2: #a8846b;
$color-3: #bc9b71;
$color-4: #f3d2b8;
$color-5: #e5bba9;

TAILWIND

colors: {
  'brand-1': '#bc896f',
  'brand-2': '#a8846b',
  'brand-3': '#bc9b71',
  'brand-4': '#f3d2b8',
  'brand-5': '#e5bba9',
}

RGB Array

[188, 137, 111], [168, 132, 107], [188, 155, 113], [243, 210, 184], [229, 187, 169]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #BC896F, #A8846B, #BC9B71, #F3D2B8, #E5BBA9 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: #bc896f; --color-2: #a8846b; --color-3: #bc9b71; --color-4: #f3d2b8; --color-5: #e5bba9. 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