#A88F8A + #A1AA8B + #CBCC93 + #FCE8AB + #F1CE8A · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A88F8A

Crimson · DarkGray · Passion Red

HEX

#A88F8A

RGB

rgb(168, 143, 138)

HSL

hsl(10, 15%, 60%)

HSB

hsb(10, 18%, 66%)

CMYK

cmyk(0%, 15%, 18%, 34%)

Oklch

oklch(67.1% 0.031 31.2)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#A1AA8B

Willow Green · DarkSeaGreen · Apple Green

HEX

#A1AA8B

RGB

rgb(161, 170, 139)

HSL

hsl(77, 15%, 61%)

HSB

hsb(77, 18%, 67%)

CMYK

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

Oklch

oklch(72.2% 0.045 120.7)

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

#CBCC93

Fresh Green · Tan · Sunflower

HEX

#CBCC93

RGB

rgb(203, 204, 147)

HSL

hsl(61, 36%, 69%)

HSB

hsb(61, 28%, 80%)

CMYK

cmyk(0%, 0%, 28%, 20%)

Oklch

oklch(83.1% 0.075 108.8)

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

#FCE8AB

Goose Yellow · Wheat · Lemon Cream

HEX

#FCE8AB

RGB

rgb(252, 232, 171)

HSL

hsl(45, 93%, 83%)

HSB

hsb(45, 32%, 99%)

CMYK

cmyk(0%, 8%, 32%, 1%)

Oklch

oklch(93.3% 0.081 92.1)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#F1CE8A

Goose Yellow · Khaki · Sunflower

HEX

#F1CE8A

RGB

rgb(241, 206, 138)

HSL

hsl(40, 79%, 74%)

HSB

hsb(40, 43%, 95%)

CMYK

cmyk(0%, 15%, 43%, 5%)

Oklch

oklch(86.6% 0.095 83.4)

Traditional「Goose Yellow」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A88F8A

8AA3A8

Analogous

A88A94

A88F8A

A89E8A

Triadic

A88F8A

8AA88F

8F8AA8

Split-Comp.

A88F8A

8AA89E

8A94A8

Tetradic

A88F8A

94A88A

8AA3A8

9E8AA8

Contrast Matrix WCAG 2.1 Contrast

A88F8A	A1AA8B	CBCC93	FCE8AB	F1CE8A
—	1.2 Fail	1.8 Fail	2.5 Fail	2.0 Fail
1.2 Fail	—	1.5 Fail	2.0 Fail	1.6 Fail
1.8 Fail	1.5 Fail	—	1.4 Fail	1.1 Fail
2.5 Fail	2.0 Fail	1.4 Fail	—	1.2 Fail
2.0 Fail	1.6 Fail	1.1 Fail	1.2 Fail	—

White BG

3.0AA Large

2.4Fail

1.7Fail

1.2Fail

1.5Fail

Black BG

7.0AA

8.6AAA

12.6AAA

17.3AAA

13.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9D9D8B

A5A593

CBCBA1

F3F3BA

E2E29A

Deuteranopia

9FA18C

A4A494

CBCBA4

F5F6BD

E4E79E

Tritanopia

A78C8C

A1989A

CBACAE

FBC5C8

EFA7AA

Achromatopsia

969696

A4A4A4

C5C5C5

E7E7E7

D1D1D1

Shades & Tints Shades & Tints

#A88F8A

Dark

Light

#A1AA8B

Dark

Light

#CBCC93

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a88f8a;
  --color-2: #a1aa8b;
  --color-3: #cbcc93;
  --color-4: #fce8ab;
  --color-5: #f1ce8a;
}

SCSS

$color-1: #a88f8a;
$color-2: #a1aa8b;
$color-3: #cbcc93;
$color-4: #fce8ab;
$color-5: #f1ce8a;

TAILWIND

colors: {
  'brand-1': '#a88f8a',
  'brand-2': '#a1aa8b',
  'brand-3': '#cbcc93',
  'brand-4': '#fce8ab',
  'brand-5': '#f1ce8a',
}

RGB Array

[168, 143, 138], [161, 170, 139], [203, 204, 147], [252, 232, 171], [241, 206, 138]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #A88F8A, #A1AA8B, #CBCC93, #FCE8AB, #F1CE8A 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: #a88f8a; --color-2: #a1aa8b; --color-3: #cbcc93; --color-4: #fce8ab; --color-5: #f1ce8a. 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