#B6D9C3 + #C6A9AC + #D48299 + #E64E81 + #FD0A60 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#B6D9C3

Celadon · Silver · Apple Green

HEX

#B6D9C3

RGB

rgb(182, 217, 195)

HSL

hsl(142, 32%, 78%)

HSB

hsb(142, 16%, 85%)

CMYK

cmyk(16%, 0%, 10%, 15%)

Oklch

oklch(85.4% 0.048 157.6)

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

#C6A9AC

Peach Pink · DarkGray · Coral Red

HEX

#C6A9AC

RGB

rgb(198, 169, 172)

HSL

hsl(354, 20%, 72%)

HSB

hsb(354, 15%, 78%)

CMYK

cmyk(0%, 15%, 13%, 22%)

Oklch

oklch(76.1% 0.034 10.9)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#D48299

Rouge · LightCoral · Rose Pink

HEX

#D48299

RGB

rgb(212, 130, 153)

HSL

hsl(343, 49%, 67%)

HSB

hsb(343, 39%, 83%)

CMYK

cmyk(0%, 39%, 28%, 17%)

Oklch

oklch(69.9% 0.104 2.0)

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

#E64E81

Dark Violet · LightCoral · Rose Pink

HEX

#E64E81

RGB

rgb(230, 78, 129)

HSL

hsl(340, 75%, 60%)

HSB

hsb(340, 66%, 90%)

CMYK

cmyk(0%, 66%, 44%, 10%)

Oklch

oklch(64.5% 0.191 3.6)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#FD0A60

Dark Violet · Crimson · Rose Pink

HEX

#FD0A60

RGB

rgb(253, 10, 96)

HSL

hsl(339, 98%, 52%)

HSB

hsb(339, 96%, 99%)

CMYK

cmyk(0%, 96%, 62%, 1%)

Oklch

oklch(63.6% 0.251 12.3)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B6D9C3

D9B5CC

Analogous

BAD9B5

B6D9C3

B5D9D4

Triadic

B6D9C3

C2B5D9

D9C2B5

Split-Comp.

B6D9C3

D4B5D9

D9B5BA

Tetradic

B6D9C3

B5BAD9

D9B5CC

D9D4B5

Contrast Matrix WCAG 2.1 Contrast

B6D9C3	C6A9AC	D48299	E64E81	FD0A60
—	1.4 Fail	1.8 Fail	2.4 Fail	2.5 Fail
1.4 Fail	—	1.3 Fail	1.7 Fail	1.8 Fail
1.8 Fail	1.3 Fail	—	1.3 Fail	1.4 Fail
2.4 Fail	1.7 Fail	1.3 Fail	—	1.1 Fail
2.5 Fail	1.8 Fail	1.4 Fail	1.1 Fail	—

White BG

1.5Fail

2.2Fail

2.8Fail

3.6AA Large

3.9AA Large

Black BG

13.7AAA

9.7AAA

7.5AAA

5.8AA

5.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C5C5C8

B9B9AB

B0B093

A4A375

94924B

Deuteranopia

C3C1CA

BBBDAB

B5BB92

ADB872

A2B446

Tritanopia

B8CDCD

C5ABAB

D08F8E

DE6B69

F13B37

Achromatopsia

CCCCCC

B2B2B2

9D9D9D

818181

5C5C5C

Shades & Tints Shades & Tints

#B6D9C3

Dark

Light

#C6A9AC

Dark

Light

#D48299

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b6d9c3;
  --color-2: #c6a9ac;
  --color-3: #d48299;
  --color-4: #e64e81;
  --color-5: #fd0a60;
}

SCSS

$color-1: #b6d9c3;
$color-2: #c6a9ac;
$color-3: #d48299;
$color-4: #e64e81;
$color-5: #fd0a60;

TAILWIND

colors: {
  'brand-1': '#b6d9c3',
  'brand-2': '#c6a9ac',
  'brand-3': '#d48299',
  'brand-4': '#e64e81',
  'brand-5': '#fd0a60',
}

RGB Array

[182, 217, 195], [198, 169, 172], [212, 130, 153], [230, 78, 129], [253, 10, 96]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B6D9C3, #C6A9AC, #D48299, #E64E81, #FD0A60 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: #b6d9c3; --color-2: #c6a9ac; --color-3: #d48299; --color-4: #e64e81; --color-5: #fd0a60. 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 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