#F0535E + #CD1B27 + #B89881 + #D5BDA5 + #ECD6BE - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F0535E

Peach Pink · Tomato · Coral Red

HEX

#F0535E

RGB

rgb(240, 83, 94)

HSL

hsl(356, 84%, 63%)

HSB

hsb(356, 65%, 94%)

CMYK

cmyk(0%, 65%, 61%, 6%)

Oklch

oklch(65.8% 0.192 20.2)

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

#CD1B27

Vermilion · Crimson · Passion Red

HEX

#CD1B27

RGB

rgb(205, 27, 39)

HSL

hsl(356, 77%, 45%)

HSB

hsb(356, 87%, 80%)

CMYK

cmyk(0%, 87%, 81%, 20%)

Oklch

oklch(54.4% 0.208 25.4)

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

#B89881

Apricot · Tan · Warm Sun

HEX

#B89881

RGB

rgb(184, 152, 129)

HSL

hsl(25, 28%, 61%)

HSB

hsb(25, 30%, 72%)

CMYK

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

Oklch

oklch(70.3% 0.050 57.5)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#D5BDA5

Goose Yellow · Tan · Warm Sun

HEX

#D5BDA5

RGB

rgb(213, 189, 165)

HSL

hsl(30, 36%, 74%)

HSB

hsb(30, 23%, 84%)

CMYK

cmyk(0%, 11%, 23%, 16%)

Oklch

oklch(81.2% 0.043 67.2)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#ECD6BE

Goose Yellow · Wheat · Peach Orange

HEX

#ECD6BE

RGB

rgb(236, 214, 190)

HSL

hsl(31, 55%, 84%)

HSB

hsb(31, 19%, 93%)

CMYK

cmyk(0%, 9%, 19%, 7%)

Oklch

oklch(88.8% 0.040 69.7)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F0535E

51F0E5

Analogous

F051AB

F0535E

F09651

Triadic

F0535E

5CF051

515CF0

Split-Comp.

F0535E

51F096

51ABF0

Tetradic

F0535E

ABF051

51F0E5

9651F0

Contrast Matrix WCAG 2.1 Contrast

F0535E	CD1B27	B89881	D5BDA5	ECD6BE
—	1.6 Fail	1.3 Fail	1.9 Fail	2.4 Fail
1.6 Fail	—	2.1 Fail	3.1 AA Large	3.9 AA Large
1.3 Fail	2.1 Fail	—	1.5 Fail	1.9 Fail
1.9 Fail	3.1 AA Large	1.5 Fail	—	1.3 Fail
2.4 Fail	3.9 AA Large	1.9 Fail	1.3 Fail	—

White BG

3.4AA Large

5.6AA

2.7Fail

1.8Fail

1.4Fail

Black BG

6.1AA

3.8AA Large

7.8AAA

11.7AAA

14.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

ACAB5B

807E24

AAAA87

CBCAAB

E2E2C4

Deuteranopia

B5C15B

8A9823

ACAE88

CCCEAC

E4E5C5

Tritanopia

E85959

C42221

B68B8C

D4AFB0

EBC8C9

Achromatopsia

838383

525252

9F9F9F

C1C1C1

DADADA

Shades & Tints Shades & Tints

#F0535E

Dark

Light

#CD1B27

Dark

Light

#B89881

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f0535e;
  --color-2: #cd1b27;
  --color-3: #b89881;
  --color-4: #d5bda5;
  --color-5: #ecd6be;
}

SCSS

$color-1: #f0535e;
$color-2: #cd1b27;
$color-3: #b89881;
$color-4: #d5bda5;
$color-5: #ecd6be;

TAILWIND

colors: {
  'brand-1': '#f0535e',
  'brand-2': '#cd1b27',
  'brand-3': '#b89881',
  'brand-4': '#d5bda5',
  'brand-5': '#ecd6be',
}

RGB Array

[240, 83, 94], [205, 27, 39], [184, 152, 129], [213, 189, 165], [236, 214, 190]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F0535E, #CD1B27, #B89881, #D5BDA5, #ECD6BE 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: #f0535e; --color-2: #cd1b27; --color-3: #b89881; --color-4: #d5bda5; --color-5: #ecd6be. 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