← Back to Editor

#CEC9A3 · #9FBE9F · #69AE9B · #11172F · #5C6493

sea

A 5-color sea palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#CEC9A3

Fresh Green · Tan · Sunflower

HEX
#CEC9A3
RGB
rgb(206, 201, 163)
HSL
hsl(53, 30%, 72%)
HSB
hsb(53, 21%, 81%)
CMYK
cmyk(0%, 2%, 21%, 19%)
Oklch
oklch(83.0% 0.051 101.2)

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

#9FBE9F

Celadon · DarkSeaGreen · Apple Green

HEX
#9FBE9F
RGB
rgb(159, 190, 159)
HSL
hsl(120, 19%, 68%)
HSB
hsb(120, 16%, 75%)
CMYK
cmyk(16%, 0%, 16%, 25%)
Oklch
oklch(77.0% 0.055 145.0)

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

#69AE9B

Mineral Blue · CadetBlue · Lake Green

HEX
#69AE9B
RGB
rgb(105, 174, 155)
HSL
hsl(163, 30%, 55%)
HSB
hsb(163, 40%, 68%)
CMYK
cmyk(40%, 0%, 11%, 32%)
Oklch
oklch(69.9% 0.076 174.5)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#11172F

Indigo · Black · Deep Sea Blue

HEX
#11172F
RGB
rgb(17, 23, 47)
HSL
hsl(228, 47%, 13%)
HSB
hsb(228, 64%, 18%)
CMYK
cmyk(64%, 51%, 0%, 82%)
Oklch
oklch(21.3% 0.048 271.2)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#5C6493

Indigo · SlateGray · Navy Blue

HEX
#5C6493
RGB
rgb(92, 100, 147)
HSL
hsl(231, 23%, 47%)
HSB
hsb(231, 37%, 58%)
CMYK
cmyk(37%, 32%, 0%, 42%)
Oklch
oklch(51.6% 0.075 276.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CEC9A3
A2A7CD

Analogous

CDB3A2
CEC9A3
BDCDA2

Triadic

CEC9A3
A2CDC8
C8A2CD

Split-Comp.

CEC9A3
A2BDCD
B3A2CD

Tetradic

CEC9A3
A2CDB3
A2A7CD
CDA2BD

Contrast Matrix WCAG 2.1 Contrast

CEC9A3
9FBE9F
69AE9B
11172F
5C6493
—
1.2
Fail
1.5
Fail
10.5
AAA
3.4
AA Large
1.2
Fail
—
1.3
Fail
8.7
AAA
2.8
Fail
1.5
Fail
1.3
Fail
—
6.8
AA
2.2
Fail
10.5
AAA
8.7
AAA
6.8
AA
—
3.1
AA Large
3.4
AA Large
2.8
Fail
2.2
Fail
3.1
AA Large
—
White BG
1.7Fail
2.0Fail
2.6Fail
17.7AAA
5.7AA
Black BG
12.5AAA
10.3AAA
8.1AAA
1.2Fail
3.7AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

CCCCAC
ACADA7
8787A0
141429
5F6088

Deuteranopia

CCCDAE
ABA8A8
837EA1
131328
5F5E85

Tritanopia

CEB3B5
A1ACAE
6CA3A4
112524
5C7F7D

Achromatopsia

C6C6C6
B1B1B1
979797
181818
676767

Shades & Tints Shades & Tints

#CEC9A3

Dark
Light

#9FBE9F

Dark
Light

#69AE9B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cec9a3;
  --color-2: #9fbe9f;
  --color-3: #69ae9b;
  --color-4: #11172f;
  --color-5: #5c6493;
}

SCSS

$color-1: #cec9a3;
$color-2: #9fbe9f;
$color-3: #69ae9b;
$color-4: #11172f;
$color-5: #5c6493;

TAILWIND

colors: {
  'brand-1': '#cec9a3',
  'brand-2': '#9fbe9f',
  'brand-3': '#69ae9b',
  'brand-4': '#11172f',
  'brand-5': '#5c6493',
}

RGB Array

[206, 201, 163], [159, 190, 159], [105, 174, 155], [17, 23, 47], [92, 100, 147]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #CEC9A3, #9FBE9F, #69AE9B, #11172F, #5C6493 is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #cec9a3; --color-2: #9fbe9f; --color-3: #69ae9b; --color-4: #11172f; --color-5: #5c6493. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. High-contrast palettes naturally meet WCAG accessibility standards. 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. Restrained colors convey professionalism and trust. 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