#DEDEDE + #D6CCCC + #F32D26 + #E63832 + #D7CCCC - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#DEDEDE

Plain White · LightGray · Cloud White

HEX

#DEDEDE

RGB

rgb(222, 222, 222)

HSL

hsl(0, 0%, 87%)

HSB

hsb(0, 0%, 87%)

CMYK

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

Oklch

oklch(90.1% 0.000 89.9)

Traditional「Plain White」· Paint「Cloud White」· Creative Silver Lining

#D6CCCC

Peach Pink · LightGray · Cherry Blossom

HEX

#D6CCCC

RGB

rgb(214, 204, 204)

HSL

hsl(0, 11%, 82%)

HSB

hsb(0, 5%, 84%)

CMYK

cmyk(0%, 5%, 5%, 16%)

Oklch

oklch(85.3% 0.011 17.4)

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

#F32D26

Vermilion · Crimson · Passion Red

HEX

#F32D26

RGB

rgb(243, 45, 38)

HSL

hsl(2, 90%, 55%)

HSB

hsb(2, 84%, 95%)

CMYK

cmyk(0%, 81%, 84%, 5%)

Oklch

oklch(62.3% 0.231 28.5)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#E63832

Vermilion · Crimson · Passion Red

HEX

#E63832

RGB

rgb(230, 56, 50)

HSL

hsl(2, 78%, 55%)

HSB

hsb(2, 78%, 90%)

CMYK

cmyk(0%, 76%, 78%, 10%)

Oklch

oklch(60.9% 0.211 27.6)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#D7CCCC

Peach Pink · LightGray · Cherry Blossom

HEX

#D7CCCC

RGB

rgb(215, 204, 204)

HSL

hsl(0, 12%, 82%)

HSB

hsb(0, 5%, 84%)

CMYK

cmyk(0%, 5%, 5%, 16%)

Oklch

oklch(85.4% 0.012 17.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DEDEDE

Analogous

DEDEDE

Triadic

DEDEDE

Split-Comp.

DEDEDE

Tetradic

DEDEDE

Contrast Matrix WCAG 2.1 Contrast

DEDEDE	D6CCCC	F32D26	E63832	D7CCCC
—	1.2 Fail	3.0 Fail	3.1 AA Large	1.2 Fail
1.2 Fail	—	2.6 Fail	2.7 Fail	1.0 Fail
3.0 Fail	2.6 Fail	—	1.0 Fail	2.6 Fail
3.1 AA Large	2.7 Fail	1.0 Fail	—	2.7 Fail
1.2 Fail	1.0 Fail	2.6 Fail	2.7 Fail	—

White BG

1.3Fail

1.6Fail

4.0AA Large

4.2AA Large

1.6Fail

Black BG

15.6AAA

13.4AAA

5.2AA

5.0AA

13.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DEDEDE

D2D2CC

9D9B28

9B9933

D2D2CC

Deuteranopia

DEDEDE

D2D3CC

A9B828

A5B234

D3D4CC

Tritanopia

DEDEDE

D5CCCC

E92929

DD3535

D6CCCC

Achromatopsia

DEDEDE

CFCFCF

676767

6B6B6B

CFCFCF

Shades & Tints Shades & Tints

#DEDEDE

Dark

Light

#D6CCCC

Dark

Light

#F32D26

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dedede;
  --color-2: #d6cccc;
  --color-3: #f32d26;
  --color-4: #e63832;
  --color-5: #d7cccc;
}

SCSS

$color-1: #dedede;
$color-2: #d6cccc;
$color-3: #f32d26;
$color-4: #e63832;
$color-5: #d7cccc;

TAILWIND

colors: {
  'brand-1': '#dedede',
  'brand-2': '#d6cccc',
  'brand-3': '#f32d26',
  'brand-4': '#e63832',
  'brand-5': '#d7cccc',
}

RGB Array

[222, 222, 222], [214, 204, 204], [243, 45, 38], [230, 56, 50], [215, 204, 204]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DEDEDE, #D6CCCC, #F32D26, #E63832, #D7CCCC 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: #dedede; --color-2: #d6cccc; --color-3: #f32d26; --color-4: #e63832; --color-5: #d7cccc. 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