← Back to Editor

#98999B · #A5B5B4 · #D8D7D3 · #CEC4A1 · #C6AC8B

sea

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#98999B

Ash · DarkGray · Silver Sand

HEX
#98999B
RGB
rgb(152, 153, 155)
HSL
hsl(220, 1%, 60%)
HSB
hsb(220, 2%, 61%)
CMYK
cmyk(2%, 1%, 0%, 39%)
Oklch
oklch(68.3% 0.003 264.5)

TraditionalAsh」· PaintSilver Sand」· Creative Urban Concrete

#A5B5B4

Jade · DarkGray · Lake Green

HEX
#A5B5B4
RGB
rgb(165, 181, 180)
HSL
hsl(176, 10%, 68%)
HSB
hsb(176, 9%, 71%)
CMYK
cmyk(9%, 0%, 1%, 29%)
Oklch
oklch(76.0% 0.018 192.2)

TraditionalJade」· PaintLake Green」· Creative Arctic Pool

#D8D7D3

Silver Gray · LightGray · Pearl Gray

HEX
#D8D7D3
RGB
rgb(216, 215, 211)
HSL
hsl(48, 6%, 84%)
HSB
hsb(48, 2%, 85%)
CMYK
cmyk(0%, 0%, 2%, 15%)
Oklch
oklch(87.9% 0.006 95.1)

TraditionalSilver Gray」· PaintPearl Gray」· Creative Silver Lining

#CEC4A1

Goose Yellow · Tan · Sunflower

HEX
#CEC4A1
RGB
rgb(206, 196, 161)
HSL
hsl(47, 31%, 72%)
HSB
hsb(47, 22%, 81%)
CMYK
cmyk(0%, 5%, 22%, 19%)
Oklch
oklch(81.9% 0.048 94.0)

TraditionalGoose Yellow」· PaintSunflower」· Creative Lemon Fizz

#C6AC8B

Ginger · Tan · Warm Sun

HEX
#C6AC8B
RGB
rgb(198, 172, 139)
HSL
hsl(34, 34%, 66%)
HSB
hsb(34, 30%, 78%)
CMYK
cmyk(0%, 13%, 30%, 22%)
Oklch
oklch(75.9% 0.054 73.5)

TraditionalGinger」· PaintWarm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

98999B
9A9998

Analogous

989A9A
98999B
98989A

Triadic

98999B
9A9899
999A98

Split-Comp.

98999B
9A9898
9A9A98

Tetradic

98999B
9A989A
9A9998
989A98

Contrast Matrix WCAG 2.1 Contrast

98999B
A5B5B4
D8D7D3
CEC4A1
C6AC8B
1.3
Fail
2.0
Fail
1.6
Fail
1.3
Fail
1.3
Fail
1.5
Fail
1.2
Fail
1.0
Fail
2.0
Fail
1.5
Fail
1.2
Fail
1.5
Fail
1.6
Fail
1.2
Fail
1.2
Fail
1.2
Fail
1.3
Fail
1.0
Fail
1.5
Fail
1.2
Fail
White BG
2.9Fail
2.1Fail
1.4Fail
1.7Fail
2.2Fail
Black BG
7.4AAA
9.9AAA
14.6AAA
12.0AAA
9.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

98989B
ACACB4
D8D8D4
CACAA9
BBBB93

Deuteranopia

98989A
ABAAB4
D8D8D4
CACBAC
BCBE95

Tritanopia

989A9A
A6B4B4
D8D5D5
CEB0B2
C5999B

Achromatopsia

999999
B0B0B0
D7D7D7
C3C3C3
B0B0B0

Shades & Tints Shades & Tints

#98999B

Dark
Light

#A5B5B4

Dark
Light

#D8D7D3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #98999b;
  --color-2: #a5b5b4;
  --color-3: #d8d7d3;
  --color-4: #cec4a1;
  --color-5: #c6ac8b;
}

SCSS

$color-1: #98999b;
$color-2: #a5b5b4;
$color-3: #d8d7d3;
$color-4: #cec4a1;
$color-5: #c6ac8b;

TAILWIND

colors: {
  'brand-1': '#98999b',
  'brand-2': '#a5b5b4',
  'brand-3': '#d8d7d3',
  'brand-4': '#cec4a1',
  'brand-5': '#c6ac8b',
}

RGB Array

[152, 153, 155], [165, 181, 180], [216, 215, 211], [206, 196, 161], [198, 172, 139]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #98999B, #A5B5B4, #D8D7D3, #CEC4A1, #C6AC8B is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. 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: #98999b; --color-2: #a5b5b4; --color-3: #d8d7d3; --color-4: #cec4a1; --color-5: #c6ac8b. 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 beauty, lifestyle, arts 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