← Back to Editor

#CABCA2 · #B2B691 · #608E74 · #527B73 · #3C887B

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 Library

Color Details Color Details

#CABCA2

Goose Yellow · Tan · Warm Sun

HEX
#CABCA2
RGB
rgb(202, 188, 162)
HSL
hsl(39, 27%, 71%)
HSB
hsb(39, 20%, 79%)
CMYK
cmyk(0%, 7%, 20%, 21%)
Oklch
oklch(80.0% 0.039 83.0)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#B2B691

Fresh Green · DarkGray · Sunflower

HEX
#B2B691
RGB
rgb(178, 182, 145)
HSL
hsl(66, 20%, 64%)
HSB
hsb(66, 20%, 71%)
CMYK
cmyk(2%, 0%, 20%, 29%)
Oklch
oklch(76.3% 0.051 112.6)

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

#608E74

Celadon · SlateGray · Olive Green

HEX
#608E74
RGB
rgb(96, 142, 116)
HSL
hsl(146, 19%, 47%)
HSB
hsb(146, 32%, 56%)
CMYK
cmyk(32%, 0%, 18%, 44%)
Oklch
oklch(60.6% 0.064 159.0)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#527B73

Mineral Blue · DimGray · Mint Ice

HEX
#527B73
RGB
rgb(82, 123, 115)
HSL
hsl(168, 20%, 40%)
HSB
hsb(168, 33%, 48%)
CMYK
cmyk(33%, 0%, 7%, 52%)
Oklch
oklch(55.0% 0.048 180.9)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#3C887B

Mineral Blue · SeaGreen · Mint Ice

HEX
#3C887B
RGB
rgb(60, 136, 123)
HSL
hsl(170, 39%, 38%)
HSB
hsb(170, 56%, 53%)
CMYK
cmyk(56%, 0%, 10%, 47%)
Oklch
oklch(57.5% 0.078 180.6)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CABCA2
A1AFC9

Analogous

C9A7A1
CABCA2
C3C9A1

Triadic

CABCA2
A1C9BB
BBA1C9

Split-Comp.

CABCA2
A1C3C9
A7A1C9

Tetradic

CABCA2
A1C9A7
A1AFC9
C9A1C3

Contrast Matrix WCAG 2.1 Contrast

CABCA2
B2B691
608E74
527B73
3C887B
—
1.1
Fail
2.0
Fail
2.5
Fail
2.2
Fail
1.1
Fail
—
1.8
Fail
2.3
Fail
2.0
Fail
2.0
Fail
1.8
Fail
—
1.3
Fail
1.1
Fail
2.5
Fail
2.3
Fail
1.3
Fail
—
1.1
Fail
2.2
Fail
2.0
Fail
1.1
Fail
1.1
Fail
—
White BG
1.9Fail
2.1Fail
3.7AA Large
4.7AA
4.2AA Large
Black BG
11.2AAA
10.0AAA
5.6AA
4.4AA Large
5.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C4C4A8
B4B49A
74747A
646475
5D5E7E

Deuteranopia

C5C6AA
B4B39C
716E7C
615E75
59537F

Tritanopia

C9ADAE
B2A1A3
627F80
547677
408181

Achromatopsia

BDBDBD
B1B1B1
7D7D7D
6E6E6E
707070

Shades & Tints Shades & Tints

#CABCA2

Dark
Light

#B2B691

Dark
Light

#608E74

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cabca2;
  --color-2: #b2b691;
  --color-3: #608e74;
  --color-4: #527b73;
  --color-5: #3c887b;
}

SCSS

$color-1: #cabca2;
$color-2: #b2b691;
$color-3: #608e74;
$color-4: #527b73;
$color-5: #3c887b;

TAILWIND

colors: {
  'brand-1': '#cabca2',
  'brand-2': '#b2b691',
  'brand-3': '#608e74',
  'brand-4': '#527b73',
  'brand-5': '#3c887b',
}

RGB Array

[202, 188, 162], [178, 182, 145], [96, 142, 116], [82, 123, 115], [60, 136, 123]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #CABCA2, #B2B691, #608E74, #527B73, #3C887B is ideal for: brand design, premium product pages, magazine layouts. 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: #cabca2; --color-2: #b2b691; --color-3: #608e74; --color-4: #527b73; --color-5: #3c887b. 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. 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