← Back to Editor

#898B75 · #9AA690 · #AAC0AB · #BBDBC6 · #D6E6DB

cool

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryClean

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#898B75

Autumn Sage · Gray · Warm Gray

HEX
#898B75
RGB
rgb(137, 139, 117)
HSL
hsl(65, 9%, 50%)
HSB
hsb(65, 16%, 55%)
CMYK
cmyk(1%, 0%, 16%, 45%)
Oklch
oklch(62.9% 0.032 111.5)

Traditional「Autumn Sage」· Paint「Warm Gray」· Creative Urban Concrete

#9AA690

Celadon · DarkSeaGreen · Apple Green

HEX
#9AA690
RGB
rgb(154, 166, 144)
HSL
hsl(93, 11%, 61%)
HSB
hsb(93, 13%, 65%)
CMYK
cmyk(7%, 0%, 13%, 35%)
Oklch
oklch(70.9% 0.034 130.7)

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

#AAC0AB

Celadon · DarkGray · Apple Green

HEX
#AAC0AB
RGB
rgb(170, 192, 171)
HSL
hsl(123, 15%, 71%)
HSB
hsb(123, 11%, 75%)
CMYK
cmyk(11%, 0%, 11%, 25%)
Oklch
oklch(78.5% 0.038 146.4)

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

#BBDBC6

Celadon · Silver · Apple Green

HEX
#BBDBC6
RGB
rgb(187, 219, 198)
HSL
hsl(141, 31%, 80%)
HSB
hsb(141, 15%, 86%)
CMYK
cmyk(15%, 0%, 10%, 14%)
Oklch
oklch(86.2% 0.044 156.6)

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

#D6E6DB

Celadon · LightGray · Mint Green

HEX
#D6E6DB
RGB
rgb(214, 230, 219)
HSL
hsl(139, 24%, 87%)
HSB
hsb(139, 7%, 90%)
CMYK
cmyk(7%, 0%, 5%, 10%)
Oklch
oklch(91.0% 0.023 155.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

898B75
76748B

Analogous

8B8174
898B75
7E8B74

Triadic

898B75
74898B
8B7489

Split-Comp.

898B75
747E8B
81748B

Tetradic

898B75
748B81
76748B
8B747E

Contrast Matrix WCAG 2.1 Contrast

898B75
9AA690
AAC0AB
BBDBC6
D6E6DB
—
1.4
Fail
1.8
Fail
2.3
Fail
2.7
Fail
1.4
Fail
—
1.3
Fail
1.7
Fail
2.0
Fail
1.8
Fail
1.3
Fail
—
1.3
Fail
1.5
Fail
2.3
Fail
1.7
Fail
1.3
Fail
—
1.2
Fail
2.7
Fail
2.0
Fail
1.5
Fail
1.2
Fail
—
White BG
3.5AA Large
2.6Fail
1.9Fail
1.5Fail
1.3Fail
Black BG
6.0AA
8.2AAA
10.8AAA
14.1AAA
16.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8A8A7A
9F9F95
B4B4B0
C9C9CB
DDDDDE

Deuteranopia

8A8A7C
9F9E97
B2B1B1
C7C5CC
DCDBDE

Tritanopia

897F7F
9B9A9A
ABB4B5
BDCFD0
D7E0E0

Achromatopsia

888888
A0A0A0
B7B7B7
CFCFCF
E0E0E0

Shades & Tints Shades & Tints

#898B75

Dark
Light

#9AA690

Dark
Light

#AAC0AB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #898b75;
  --color-2: #9aa690;
  --color-3: #aac0ab;
  --color-4: #bbdbc6;
  --color-5: #d6e6db;
}

SCSS

$color-1: #898b75;
$color-2: #9aa690;
$color-3: #aac0ab;
$color-4: #bbdbc6;
$color-5: #d6e6db;

TAILWIND

colors: {
  'brand-1': '#898b75',
  'brand-2': '#9aa690',
  'brand-3': '#aac0ab',
  'brand-4': '#bbdbc6',
  'brand-5': '#d6e6db',
}

RGB Array

[137, 139, 117], [154, 166, 144], [170, 192, 171], [187, 219, 198], [214, 230, 219]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #898B75, #9AA690, #AAC0AB, #BBDBC6, #D6E6DB 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: #898b75; --color-2: #9aa690; --color-3: #aac0ab; --color-4: #bbdbc6; --color-5: #d6e6db. 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 cool-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