← Back to Editor

#BAD9CD · #F7FCCA · #F0CFC5 · #C7ADBD · #756A6D

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#BAD9CD

Jade · LightGray · Apple Green

HEX
#BAD9CD
RGB
rgb(186, 217, 205)
HSL
hsl(157, 29%, 79%)
HSB
hsb(157, 14%, 85%)
CMYK
cmyk(14%, 0%, 6%, 15%)
Oklch
oklch(85.9% 0.037 170.1)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#F7FCCA

Fresh Green · Beige · Lemon Cream

HEX
#F7FCCA
RGB
rgb(247, 252, 202)
HSL
hsl(66, 89%, 89%)
HSB
hsb(66, 20%, 99%)
CMYK
cmyk(2%, 0%, 20%, 1%)
Oklch
oklch(97.5% 0.065 112.2)

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

#F0CFC5

Peach Pink · Pink · Cherry Blossom

HEX
#F0CFC5
RGB
rgb(240, 207, 197)
HSL
hsl(14, 59%, 86%)
HSB
hsb(14, 18%, 94%)
CMYK
cmyk(0%, 14%, 18%, 6%)
Oklch
oklch(88.0% 0.040 37.5)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#C7ADBD

Mauve · Silver · Rose Pink

HEX
#C7ADBD
RGB
rgb(199, 173, 189)
HSL
hsl(323, 19%, 73%)
HSB
hsb(323, 13%, 78%)
CMYK
cmyk(0%, 13%, 5%, 22%)
Oklch
oklch(77.5% 0.037 340.6)

Traditional「Mauve」· Paint「Rose Pink」· Creative Rose Petal

#756A6D

Ink Gray · DimGray · Warm Gray

HEX
#756A6D
RGB
rgb(117, 106, 109)
HSL
hsl(344, 5%, 44%)
HSB
hsb(344, 9%, 46%)
CMYK
cmyk(0%, 9%, 7%, 54%)
Oklch
oklch(53.5% 0.015 359.2)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BAD9CD
D9BAC6

Analogous

BAD9BE
BAD9CD
BAD5D9

Triadic

BAD9CD
CDBAD9
D9CDBA

Split-Comp.

BAD9CD
D9BAD5
D9BEBA

Tetradic

BAD9CD
BEBAD9
D9BAC6
D5D9BA

Contrast Matrix WCAG 2.1 Contrast

BAD9CD
F7FCCA
F0CFC5
C7ADBD
756A6D
—
1.4
Fail
1.0
Fail
1.4
Fail
3.4
AA Large
1.4
Fail
—
1.4
Fail
1.9
Fail
4.9
AA
1.0
Fail
1.4
Fail
—
1.4
Fail
3.6
AA Large
1.4
Fail
1.9
Fail
1.4
Fail
—
2.5
Fail
3.4
AA Large
4.9
AA
3.6
AA Large
2.5
Fail
—
White BG
1.5Fail
1.1Fail
1.5Fail
2.1Fail
5.2AA
Black BG
13.9AAA
19.7AAA
14.4AAA
10.1AAA
4.0AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

C7C8D0
F9F9D6
E2E1C7
BCBCB9
70706C

Deuteranopia

C6C3D1
F9F8D9
E4E6C8
BDBFB8
71726C

Tritanopia

BCD2D3
F7E0E2
EEC9CA
C6B6B5
746C6C

Achromatopsia

CECECE
F5F5F5
D8D8D8
B7B7B7
6E6E6E

Shades & Tints Shades & Tints

#BAD9CD

Dark
Light

#F7FCCA

Dark
Light

#F0CFC5

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bad9cd;
  --color-2: #f7fcca;
  --color-3: #f0cfc5;
  --color-4: #c7adbd;
  --color-5: #756a6d;
}

SCSS

$color-1: #bad9cd;
$color-2: #f7fcca;
$color-3: #f0cfc5;
$color-4: #c7adbd;
$color-5: #756a6d;

TAILWIND

colors: {
  'brand-1': '#bad9cd',
  'brand-2': '#f7fcca',
  'brand-3': '#f0cfc5',
  'brand-4': '#c7adbd',
  'brand-5': '#756a6d',
}

RGB Array

[186, 217, 205], [247, 252, 202], [240, 207, 197], [199, 173, 189], [117, 106, 109]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BAD9CD, #F7FCCA, #F0CFC5, #C7ADBD, #756A6D is ideal for: health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #bad9cd; --color-2: #f7fcca; --color-3: #f0cfc5; --color-4: #c7adbd; --color-5: #756a6d. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 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