← Back to Editor

#9CBABA · #A6BBB4 · #B1BCAA · #BEBDA0 · #C6BE9A

earth

A 5-color earth 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

#9CBABA

Sky Blue · DarkGray · Lake Green

HEX
#9CBABA
RGB
rgb(156, 186, 186)
HSL
hsl(180, 18%, 67%)
HSB
hsb(180, 16%, 73%)
CMYK
cmyk(16%, 0%, 0%, 27%)
Oklch
oklch(76.7% 0.033 196.5)

TraditionalSky Blue」· PaintLake Green」· Creative Arctic Pool

#A6BBB4

Jade · DarkGray · Lake Green

HEX
#A6BBB4
RGB
rgb(166, 187, 180)
HSL
hsl(160, 13%, 69%)
HSB
hsb(160, 11%, 73%)
CMYK
cmyk(11%, 0%, 4%, 27%)
Oklch
oklch(77.4% 0.025 173.6)

TraditionalJade」· PaintLake Green」· Creative Arctic Pool

#B1BCAA

Celadon · DarkGray · Apple Green

HEX
#B1BCAA
RGB
rgb(177, 188, 170)
HSL
hsl(97, 12%, 70%)
HSB
hsb(97, 10%, 74%)
CMYK
cmyk(6%, 0%, 10%, 26%)
Oklch
oklch(78.2% 0.028 133.0)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#BEBDA0

Fresh Green · Tan · Sunflower

HEX
#BEBDA0
RGB
rgb(190, 189, 160)
HSL
hsl(58, 19%, 69%)
HSB
hsb(58, 16%, 75%)
CMYK
cmyk(0%, 1%, 16%, 25%)
Oklch
oklch(79.1% 0.040 105.6)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

#C6BE9A

Ginger · Tan · Sunflower

HEX
#C6BE9A
RGB
rgb(198, 190, 154)
HSL
hsl(49, 28%, 69%)
HSB
hsb(49, 22%, 78%)
CMYK
cmyk(0%, 4%, 22%, 22%)
Oklch
oklch(79.9% 0.049 96.9)

TraditionalGinger」· PaintSunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9CBABA
BA9C9C

Analogous

9CBAAB
9CBABA
9CABBA

Triadic

9CBABA
BA9CBA
BABA9C

Split-Comp.

9CBABA
BA9CAB
BAAB9C

Tetradic

9CBABA
AB9CBA
BA9C9C
ABBA9C

Contrast Matrix WCAG 2.1 Contrast

9CBABA
A6BBB4
B1BCAA
BEBDA0
C6BE9A
1.0
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.0
Fail
White BG
2.1Fail
2.0Fail
2.0Fail
1.9Fail
1.9Fail
Black BG
10.1AAA
10.4AAA
10.6AAA
11.0AAA
11.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A9A9BA
AFAFB6
B6B6AE
BEBEA7
C3C2A3

Deuteranopia

A7A5BA
AEACB6
B5B4AF
BEBEA9
C3C4A5

Tritanopia

9EBABA
A7B7B7
B2B2B3
BEADAE
C6AAAB

Achromatopsia

B1B1B1
B4B4B4
B7B7B7
BABABA
BCBCBC

Shades & Tints Shades & Tints

#9CBABA

Dark
Light

#A6BBB4

Dark
Light

#B1BCAA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9cbaba;
  --color-2: #a6bbb4;
  --color-3: #b1bcaa;
  --color-4: #bebda0;
  --color-5: #c6be9a;
}

SCSS

$color-1: #9cbaba;
$color-2: #a6bbb4;
$color-3: #b1bcaa;
$color-4: #bebda0;
$color-5: #c6be9a;

TAILWIND

colors: {
  'brand-1': '#9cbaba',
  'brand-2': '#a6bbb4',
  'brand-3': '#b1bcaa',
  'brand-4': '#bebda0',
  'brand-5': '#c6be9a',
}

RGB Array

[156, 186, 186], [166, 187, 180], [177, 188, 170], [190, 189, 160], [198, 190, 154]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #9CBABA, #A6BBB4, #B1BCAA, #BEBDA0, #C6BE9A 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: #9cbaba; --color-2: #a6bbb4; --color-3: #b1bcaa; --color-4: #bebda0; --color-5: #c6be9a. 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 earth-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