#FF1068 + #E7203E + #C15567 + #CDD0AF + #8BA7A1 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#FF1068

Dark Violet · DeepPink · Rose Pink

HEX

#FF1068

RGB

rgb(255, 16, 104)

HSL

hsl(338, 100%, 53%)

HSB

hsb(338, 94%, 100%)

CMYK

cmyk(0%, 94%, 59%, 0%)

Oklch

oklch(64.2% 0.252 10.3)

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

#E7203E

Vermilion · Crimson · Passion Red

HEX

#E7203E

RGB

rgb(231, 32, 62)

HSL

hsl(351, 81%, 52%)

HSB

hsb(351, 86%, 91%)

CMYK

cmyk(0%, 86%, 73%, 9%)

Oklch

oklch(59.7% 0.226 21.3)

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

#C15567

Crimson · Sienna · Passion Red

HEX

#C15567

RGB

rgb(193, 85, 103)

HSL

hsl(350, 47%, 55%)

HSB

hsb(350, 56%, 76%)

CMYK

cmyk(0%, 56%, 47%, 24%)

Oklch

oklch(59.1% 0.139 12.1)

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

#CDD0AF

Fresh Green · Silver · Sunflower

HEX

#CDD0AF

RGB

rgb(205, 208, 175)

HSL

hsl(65, 26%, 75%)

HSB

hsb(65, 16%, 82%)

CMYK

cmyk(1%, 0%, 16%, 18%)

Oklch

oklch(84.7% 0.045 111.6)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#8BA7A1

Mineral Blue · DarkSeaGreen · Lake Green

HEX

#8BA7A1

RGB

rgb(139, 167, 161)

HSL

hsl(167, 14%, 60%)

HSB

hsb(167, 17%, 65%)

CMYK

cmyk(17%, 0%, 4%, 35%)

Oklch

oklch(70.5% 0.032 180.9)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF1068

0FFFA7

Analogous

FF0FDF

FF1068

FF2F0F

Triadic

FF1068

67FF0F

0F67FF

Split-Comp.

FF1068

0FFF2F

0FDFFF

Tetradic

FF1068

DFFF0F

0FFFA7

2F0FFF

Contrast Matrix WCAG 2.1 Contrast

FF1068	E7203E	C15567	CDD0AF	8BA7A1
—	1.2 Fail	1.2 Fail	2.4 Fail	1.5 Fail
1.2 Fail	—	1.0 Fail	2.8 Fail	1.7 Fail
1.2 Fail	1.0 Fail	—	2.8 Fail	1.7 Fail
2.4 Fail	2.8 Fail	2.8 Fail	—	1.6 Fail
1.5 Fail	1.7 Fail	1.7 Fail	1.6 Fail	—

White BG

3.8AA Large

4.5AA Large

4.4AA Large

1.6Fail

2.6Fail

Black BG

5.5AA

4.7AA

4.8AA

13.2AAA

8.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

989553

918F37

929163

CECEB7

9797A2

Deuteranopia

A5B74E

9CAB35

99A162

CECEB9

9693A3

Tritanopia

F3423E

DD3130

BC5F5E

CDBDBF

8CA4A4

Achromatopsia

616161

5F5F5F

777777

CBCBCB

9E9E9E

Shades & Tints Shades & Tints

#FF1068

Dark

Light

#E7203E

Dark

Light

#C15567

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff1068;
  --color-2: #e7203e;
  --color-3: #c15567;
  --color-4: #cdd0af;
  --color-5: #8ba7a1;
}

SCSS

$color-1: #ff1068;
$color-2: #e7203e;
$color-3: #c15567;
$color-4: #cdd0af;
$color-5: #8ba7a1;

TAILWIND

colors: {
  'brand-1': '#ff1068',
  'brand-2': '#e7203e',
  'brand-3': '#c15567',
  'brand-4': '#cdd0af',
  'brand-5': '#8ba7a1',
}

RGB Array

[255, 16, 104], [231, 32, 62], [193, 85, 103], [205, 208, 175], [139, 167, 161]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FF1068, #E7203E, #C15567, #CDD0AF, #8BA7A1 is ideal for: corporate websites, product showcases, portfolios. 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: #ff1068; --color-2: #e7203e; --color-3: #c15567; --color-4: #cdd0af; --color-5: #8ba7a1. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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