#C0648D + #FA6D8F + #F2C2B8 + #F7E7DA + #B0CABD - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C0648D

Dark Violet · LightCoral · Rose Pink

HEX

#C0648D

RGB

rgb(192, 100, 141)

HSL

hsl(333, 42%, 57%)

HSB

hsb(333, 48%, 75%)

CMYK

cmyk(0%, 48%, 27%, 25%)

Oklch

oklch(62.2% 0.126 353.3)

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

#FA6D8F

Peach Pink · LightCoral · Coral Red

HEX

#FA6D8F

RGB

rgb(250, 109, 143)

HSL

hsl(346, 93%, 70%)

HSB

hsb(346, 56%, 98%)

CMYK

cmyk(0%, 56%, 43%, 2%)

Oklch

oklch(71.5% 0.174 7.6)

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

#F2C2B8

Peach Pink · LightPink · Cherry Blossom

HEX

#F2C2B8

RGB

rgb(242, 194, 184)

HSL

hsl(10, 69%, 84%)

HSB

hsb(10, 24%, 95%)

CMYK

cmyk(0%, 20%, 24%, 5%)

Oklch

oklch(85.4% 0.057 31.8)

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

#F7E7DA

Apricot · Beige · Peach Orange

HEX

#F7E7DA

RGB

rgb(247, 231, 218)

HSL

hsl(27, 64%, 91%)

HSB

hsb(27, 12%, 97%)

CMYK

cmyk(0%, 6%, 12%, 3%)

Oklch

oklch(93.7% 0.025 61.6)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#B0CABD

Jade · Silver · Apple Green

HEX

#B0CABD

RGB

rgb(176, 202, 189)

HSL

hsl(150, 20%, 74%)

HSB

hsb(150, 13%, 79%)

CMYK

cmyk(13%, 0%, 6%, 21%)

Oklch

oklch(81.6% 0.033 164.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C0648D

63BF96

Analogous

BF63BB

C0648D

BF6863

Triadic

C0648D

8DBF63

638DBF

Split-Comp.

C0648D

63BF68

63BBBF

Tetradic

C0648D

BBBF63

63BF96

6863BF

Contrast Matrix WCAG 2.1 Contrast

C0648D	FA6D8F	F2C2B8	F7E7DA	B0CABD
—	1.4 Fail	2.4 Fail	3.2 AA Large	2.2 Fail
1.4 Fail	—	1.7 Fail	2.3 Fail	1.6 Fail
2.4 Fail	1.7 Fail	—	1.3 Fail	1.1 Fail
3.2 AA Large	2.3 Fail	1.3 Fail	—	1.4 Fail
2.2 Fail	1.6 Fail	1.1 Fail	1.4 Fail	—

White BG

3.9AA Large

2.7Fail

1.6Fail

1.2Fail

1.7Fail

Black BG

5.4AA

7.6AAA

13.2AAA

17.4AAA

12.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

989783

BDBC87

DDDDBA

F0F0DD

BBBBC0

Deuteranopia

9EA481

C5D085

E0E4BB

F1F2DE

BAB8C1

Tritanopia

BB7B7A

F3807F

F0BCBD

F6E0E0

B1C3C3

Achromatopsia

848484

9B9B9B

CFCFCF

EAEAEA

C1C1C1

Shades & Tints Shades & Tints

#C0648D

Dark

Light

#FA6D8F

Dark

Light

#F2C2B8

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c0648d;
  --color-2: #fa6d8f;
  --color-3: #f2c2b8;
  --color-4: #f7e7da;
  --color-5: #b0cabd;
}

SCSS

$color-1: #c0648d;
$color-2: #fa6d8f;
$color-3: #f2c2b8;
$color-4: #f7e7da;
$color-5: #b0cabd;

TAILWIND

colors: {
  'brand-1': '#c0648d',
  'brand-2': '#fa6d8f',
  'brand-3': '#f2c2b8',
  'brand-4': '#f7e7da',
  'brand-5': '#b0cabd',
}

RGB Array

[192, 100, 141], [250, 109, 143], [242, 194, 184], [247, 231, 218], [176, 202, 189]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C0648D, #FA6D8F, #F2C2B8, #F7E7DA, #B0CABD 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: #c0648d; --color-2: #fa6d8f; --color-3: #f2c2b8; --color-4: #f7e7da; --color-5: #b0cabd. 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