#6CA1C3 + #75C3C7 + #C1CAB9 + #E1C7B6 + #F7CCBB · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#6CA1C3

Slate Blue · CadetBlue · Navy Blue

HEX

#6CA1C3

RGB

rgb(108, 161, 195)

HSL

hsl(203, 42%, 59%)

HSB

hsb(203, 45%, 76%)

CMYK

cmyk(45%, 17%, 0%, 24%)

Oklch

oklch(68.5% 0.075 237.5)

Traditional「Slate Blue」· Paint「Navy Blue」· Creative Blush Sunrise

#75C3C7

Sky Blue · MediumAquaMarine · Lake Green

HEX

#75C3C7

RGB

rgb(117, 195, 199)

HSL

hsl(183, 42%, 62%)

HSB

hsb(183, 41%, 78%)

CMYK

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

Oklch

oklch(76.8% 0.077 199.9)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#C1CAB9

Celadon · Silver · Apple Green

HEX

#C1CAB9

RGB

rgb(193, 202, 185)

HSL

hsl(92, 14%, 76%)

HSB

hsb(92, 8%, 79%)

CMYK

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

Oklch

oklch(82.7% 0.025 129.9)

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

#E1C7B6

Apricot · Wheat · Peach Orange

HEX

#E1C7B6

RGB

rgb(225, 199, 182)

HSL

hsl(24, 42%, 80%)

HSB

hsb(24, 19%, 88%)

CMYK

cmyk(0%, 12%, 19%, 12%)

Oklch

oklch(84.7% 0.038 55.3)

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

#F7CCBB

Apricot · Wheat · Peach Orange

HEX

#F7CCBB

RGB

rgb(247, 204, 187)

HSL

hsl(17, 79%, 85%)

HSB

hsb(17, 24%, 97%)

CMYK

cmyk(0%, 17%, 24%, 3%)

Oklch

oklch(87.8% 0.054 42.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6CA1C3

C28C6B

Analogous

6BC2B8

6CA1C3

6B75C2

Triadic

6CA1C3

C26BA1

A1C26B

Split-Comp.

6CA1C3

C26B75

C2B86B

Tetradic

6CA1C3

B86BC2

C28C6B

75C26B

Contrast Matrix WCAG 2.1 Contrast

6CA1C3	75C3C7	C1CAB9	E1C7B6	F7CCBB
—	1.4 Fail	1.7 Fail	1.7 Fail	1.9 Fail
1.4 Fail	—	1.2 Fail	1.3 Fail	1.4 Fail
1.7 Fail	1.2 Fail	—	1.1 Fail	1.2 Fail
1.7 Fail	1.3 Fail	1.1 Fail	—	1.1 Fail
1.9 Fail	1.4 Fail	1.2 Fail	1.1 Fail	—

White BG

2.8Fail

2.0Fail

1.7Fail

1.6Fail

1.5Fail

Black BG

7.5AAA

10.4AAA

12.4AAA

13.0AAA

14.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8383BB

9797C6

C5C5BD

D6D6BA

E4E4BF

Deuteranopia

807CB9

928CC6

C4C4BE

D7D9BB

E7EAC0

Tritanopia

6FB4B3

79C5C5

C1C0C1

E0BDBE

F5C2C3

Achromatopsia

959595

ACACAC

C5C5C5

CDCDCD

D7D7D7

Shades & Tints Shades & Tints

#6CA1C3

Dark

Light

#75C3C7

Dark

Light

#C1CAB9

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6ca1c3;
  --color-2: #75c3c7;
  --color-3: #c1cab9;
  --color-4: #e1c7b6;
  --color-5: #f7ccbb;
}

SCSS

$color-1: #6ca1c3;
$color-2: #75c3c7;
$color-3: #c1cab9;
$color-4: #e1c7b6;
$color-5: #f7ccbb;

TAILWIND

colors: {
  'brand-1': '#6ca1c3',
  'brand-2': '#75c3c7',
  'brand-3': '#c1cab9',
  'brand-4': '#e1c7b6',
  'brand-5': '#f7ccbb',
}

RGB Array

[108, 161, 195], [117, 195, 199], [193, 202, 185], [225, 199, 182], [247, 204, 187]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #6CA1C3, #75C3C7, #C1CAB9, #E1C7B6, #F7CCBB 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: #6ca1c3; --color-2: #75c3c7; --color-3: #c1cab9; --color-4: #e1c7b6; --color-5: #f7ccbb. 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