#A6D1C8 + #C1D2C8 + #DCD2C7 + #F7D3C7 + #BAA7A7 · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A6D1C8

Jade · LightSteelBlue · Lake Green

HEX

#A6D1C8

RGB

rgb(166, 209, 200)

HSL

hsl(167, 32%, 74%)

HSB

hsb(167, 21%, 82%)

CMYK

cmyk(21%, 0%, 4%, 18%)

Oklch

oklch(82.7% 0.047 180.9)

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

#C1D2C8

Celadon · Silver · Apple Green

HEX

#C1D2C8

RGB

rgb(193, 210, 200)

HSL

hsl(145, 16%, 79%)

HSB

hsb(145, 8%, 82%)

CMYK

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

Oklch

oklch(84.8% 0.023 160.1)

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

#DCD2C7

Goose Yellow · LightGray · Peach Orange

HEX

#DCD2C7

RGB

rgb(220, 210, 199)

HSL

hsl(31, 23%, 82%)

HSB

hsb(31, 10%, 86%)

CMYK

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

Oklch

oklch(86.9% 0.019 70.2)

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

#F7D3C7

Apricot · Bisque · Peach Orange

HEX

#F7D3C7

RGB

rgb(247, 211, 199)

HSL

hsl(15, 75%, 87%)

HSB

hsb(15, 19%, 97%)

CMYK

cmyk(0%, 15%, 19%, 3%)

Oklch

oklch(89.4% 0.044 39.3)

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

#BAA7A7

Peach Pink · DarkGray · Coral Red

HEX

#BAA7A7

RGB

rgb(186, 167, 167)

HSL

hsl(0, 12%, 69%)

HSB

hsb(0, 10%, 73%)

CMYK

cmyk(0%, 10%, 10%, 27%)

Oklch

oklch(74.5% 0.022 17.7)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A6D1C8

D2A7B1

Analogous

A7D2B4

A6D1C8

A7C6D2

Triadic

A6D1C8

C9A7D2

D2C9A7

Split-Comp.

A6D1C8

D2A7C6

D2B4A7

Tetradic

A6D1C8

B4A7D2

D2A7B1

C6D2A7

Contrast Matrix WCAG 2.1 Contrast

A6D1C8	C1D2C8	DCD2C7	F7D3C7	BAA7A7
—	1.1 Fail	1.1 Fail	1.2 Fail	1.4 Fail
1.1 Fail	—	1.1 Fail	1.1 Fail	1.5 Fail
1.1 Fail	1.1 Fail	—	1.1 Fail	1.5 Fail
1.2 Fail	1.1 Fail	1.1 Fail	—	1.6 Fail
1.4 Fail	1.5 Fail	1.5 Fail	1.6 Fail	—

White BG

1.7Fail

1.6Fail

1.5Fail

1.4Fail

2.3Fail

Black BG

12.6AAA

13.3AAA

14.1AAA

15.1AAA

9.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B9B9CA

C8C9CA

D8D8CA

E7E7CA

B2B2A7

Deuteranopia

B6B3CB

C7C6CB

D8D9CA

EAECCB

B3B4A7

Tritanopia

A8CCCC

C2CCCD

DCCCCC

F5CCCD

B9A7A7

Achromatopsia

C3C3C3

CCCCCC

D4D4D4

DCDCDC

ADADAD

Shades & Tints Shades & Tints

#A6D1C8

Dark

Light

#C1D2C8

Dark

Light

#DCD2C7

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a6d1c8;
  --color-2: #c1d2c8;
  --color-3: #dcd2c7;
  --color-4: #f7d3c7;
  --color-5: #baa7a7;
}

SCSS

$color-1: #a6d1c8;
$color-2: #c1d2c8;
$color-3: #dcd2c7;
$color-4: #f7d3c7;
$color-5: #baa7a7;

TAILWIND

colors: {
  'brand-1': '#a6d1c8',
  'brand-2': '#c1d2c8',
  'brand-3': '#dcd2c7',
  'brand-4': '#f7d3c7',
  'brand-5': '#baa7a7',
}

RGB Array

[166, 209, 200], [193, 210, 200], [220, 210, 199], [247, 211, 199], [186, 167, 167]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #A6D1C8, #C1D2C8, #DCD2C7, #F7D3C7, #BAA7A7 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: #a6d1c8; --color-2: #c1d2c8; --color-3: #dcd2c7; --color-4: #f7d3c7; --color-5: #baa7a7. 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