← Back to Editor

#B2BEA6 · #A6BEAB · #BED4B7 · #B7D4BF · #C7EBD1

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

#B2BEA6

Celadon · DarkGray · Apple Green

HEX
#B2BEA6
RGB
rgb(178, 190, 166)
HSL
hsl(90, 16%, 70%)
HSB
hsb(90, 13%, 75%)
CMYK
cmyk(6%, 0%, 13%, 25%)
Oklch
oklch(78.6% 0.036 129.0)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#A6BEAB

Celadon · DarkGray · Apple Green

HEX
#A6BEAB
RGB
rgb(166, 190, 171)
HSL
hsl(132, 16%, 70%)
HSB
hsb(132, 13%, 75%)
CMYK
cmyk(13%, 0%, 10%, 25%)
Oklch
oklch(77.8% 0.037 151.5)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#BED4B7

Celadon · Silver · Apple Green

HEX
#BED4B7
RGB
rgb(190, 212, 183)
HSL
hsl(106, 25%, 77%)
HSB
hsb(106, 14%, 83%)
CMYK
cmyk(10%, 0%, 14%, 17%)
Oklch
oklch(84.6% 0.046 138.1)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#B7D4BF

Celadon · Silver · Apple Green

HEX
#B7D4BF
RGB
rgb(183, 212, 191)
HSL
hsl(137, 25%, 77%)
HSB
hsb(137, 14%, 83%)
CMYK
cmyk(14%, 0%, 10%, 17%)
Oklch
oklch(84.3% 0.042 153.9)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#C7EBD1

Celadon · LightGray · Mint Green

HEX
#C7EBD1
RGB
rgb(199, 235, 209)
HSL
hsl(137, 47%, 85%)
HSB
hsb(137, 15%, 92%)
CMYK
cmyk(15%, 0%, 11%, 8%)
Oklch
oklch(90.7% 0.052 153.9)

TraditionalCeladon」· PaintMint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B2BEA6
B3A6BF

Analogous

BFBFA6
B2BEA6
A6BFA6

Triadic

B2BEA6
A6B3BF
BFA6B3

Split-Comp.

B2BEA6
A6A6BF
BFA6BF

Tetradic

B2BEA6
A6BFBF
B3A6BF
BFA6A6

Contrast Matrix WCAG 2.1 Contrast

B2BEA6
A6BEAB
BED4B7
B7D4BF
C7EBD1
1.0
Fail
1.2
Fail
1.2
Fail
1.5
Fail
1.0
Fail
1.3
Fail
1.2
Fail
1.5
Fail
1.2
Fail
1.3
Fail
1.0
Fail
1.2
Fail
1.2
Fail
1.2
Fail
1.0
Fail
1.2
Fail
1.5
Fail
1.5
Fail
1.2
Fail
1.2
Fail
White BG
1.9Fail
2.0Fail
1.6Fail
1.6Fail
1.3Fail
Black BG
10.8AAA
10.6AAA
13.3AAA
13.2AAA
16.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B7B7AC
B0B1B0
C8C8BE
C4C4C4
D7D7D7

Deuteranopia

B7B6AD
AFADB1
C6C5C0
C2C0C5
D5D2D9

Tritanopia

B3B0B1
A7B3B4
BFC4C5
B8C8C9
C9DCDD

Achromatopsia

B8B8B8
B5B5B5
CACACA
C9C9C9
DDDDDD

Shades & Tints Shades & Tints

#B2BEA6

Dark
Light

#A6BEAB

Dark
Light

#BED4B7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b2bea6;
  --color-2: #a6beab;
  --color-3: #bed4b7;
  --color-4: #b7d4bf;
  --color-5: #c7ebd1;
}

SCSS

$color-1: #b2bea6;
$color-2: #a6beab;
$color-3: #bed4b7;
$color-4: #b7d4bf;
$color-5: #c7ebd1;

TAILWIND

colors: {
  'brand-1': '#b2bea6',
  'brand-2': '#a6beab',
  'brand-3': '#bed4b7',
  'brand-4': '#b7d4bf',
  'brand-5': '#c7ebd1',
}

RGB Array

[178, 190, 166], [166, 190, 171], [190, 212, 183], [183, 212, 191], [199, 235, 209]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B2BEA6, #A6BEAB, #BED4B7, #B7D4BF, #C7EBD1 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: #b2bea6; --color-2: #a6beab; --color-3: #bed4b7; --color-4: #b7d4bf; --color-5: #c7ebd1. 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 general-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