#FFDFC4 + #FFB3B3 + #CF7E81 + #987189 + #706796 · space - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FFDFC4

Apricot · Bisque · Peach Orange

HEX

#FFDFC4

RGB

rgb(255, 223, 196)

HSL

hsl(27, 100%, 88%)

HSB

hsb(27, 23%, 100%)

CMYK

cmyk(0%, 13%, 23%, 0%)

Oklch

oklch(92.3% 0.050 62.3)

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

#FFB3B3

Peach Pink · LightPink · Cherry Blossom

HEX

#FFB3B3

RGB

rgb(255, 179, 179)

HSL

hsl(0, 100%, 85%)

HSB

hsb(0, 30%, 100%)

CMYK

cmyk(0%, 30%, 30%, 0%)

Oklch

oklch(83.9% 0.089 19.1)

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

#CF7E81

Peach Pink · LightCoral · Coral Red

HEX

#CF7E81

RGB

rgb(207, 126, 129)

HSL

hsl(358, 46%, 65%)

HSB

hsb(358, 39%, 81%)

CMYK

cmyk(0%, 39%, 38%, 19%)

Oklch

oklch(68.0% 0.101 17.7)

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

#987189

Rose Purple · Gray · Rose Pink

HEX

#987189

RGB

rgb(152, 113, 137)

HSL

hsl(323, 16%, 52%)

HSB

hsb(323, 26%, 60%)

CMYK

cmyk(0%, 26%, 10%, 40%)

Oklch

oklch(59.5% 0.059 341.6)

Traditional「Rose Purple」· Paint「Rose Pink」· Creative Blush Sunrise

#706796

Deep Indigo · SlateGray · Navy Blue

HEX

#706796

RGB

rgb(112, 103, 150)

HSL

hsl(251, 19%, 50%)

HSB

hsb(251, 31%, 59%)

CMYK

cmyk(25%, 31%, 0%, 41%)

Oklch

oklch(54.1% 0.073 292.6)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFDFC4

C2E3FF

Analogous

FFC2C5

FFDFC4

FFFCC2

Triadic

FFDFC4

C2FFDD

DDC2FF

Split-Comp.

FFDFC4

C2FFFC

C2C5FF

Tetradic

FFDFC4

C5FFC2

C2E3FF

FCC2FF

Contrast Matrix WCAG 2.1 Contrast

FFDFC4	FFB3B3	CF7E81	987189	706796
—	1.3 Fail	2.4 Fail	3.3 AA Large	4.1 AA Large
1.3 Fail	—	1.8 Fail	2.4 Fail	3.0 AA Large
2.4 Fail	1.8 Fail	—	1.4 Fail	1.7 Fail
3.3 AA Large	2.4 Fail	1.4 Fail	—	1.2 Fail
4.1 AA Large	3.0 AA Large	1.7 Fail	1.2 Fail	—

White BG

1.3Fail

1.7Fail

3.0AA Large

4.2AA Large

5.2AA

Black BG

16.6AAA

12.4AAA

7.0AA

5.1AA

4.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

F1F1CB

DEDDB3

ACAB80

878783

6C6C8B

Deuteranopia

F3F5CC

E3E8B3

B1B780

898C82

6D6D88

Tritanopia

FDD0D1

FBB3B3

CB8080

967F7E

708280

Achromatopsia

E5E5E5

CACACA

979797

7F7F7F

6F6F6F

Shades & Tints Shades & Tints

#FFDFC4

Dark

Light

#FFB3B3

Dark

Light

#CF7E81

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffdfc4;
  --color-2: #ffb3b3;
  --color-3: #cf7e81;
  --color-4: #987189;
  --color-5: #706796;
}

SCSS

$color-1: #ffdfc4;
$color-2: #ffb3b3;
$color-3: #cf7e81;
$color-4: #987189;
$color-5: #706796;

TAILWIND

colors: {
  'brand-1': '#ffdfc4',
  'brand-2': '#ffb3b3',
  'brand-3': '#cf7e81',
  'brand-4': '#987189',
  'brand-5': '#706796',
}

RGB Array

[255, 223, 196], [255, 179, 179], [207, 126, 129], [152, 113, 137], [112, 103, 150]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #FFDFC4, #FFB3B3, #CF7E81, #987189, #706796 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: #ffdfc4; --color-2: #ffb3b3; --color-3: #cf7e81; --color-4: #987189; --color-5: #706796. 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 space-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