#F85D62 + #9C4771 + #A47484 + #B29E92 + #9AC5A7 · space - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#F85D62

Peach Pink · Tomato · Coral Red

HEX

#F85D62

RGB

rgb(248, 93, 98)

HSL

hsl(358, 92%, 67%)

HSB

hsb(358, 63%, 97%)

CMYK

cmyk(0%, 63%, 60%, 3%)

Oklch

oklch(68.2% 0.190 21.8)

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

#9C4771

Dark Violet · DimGray · Camellia

HEX

#9C4771

RGB

rgb(156, 71, 113)

HSL

hsl(330, 37%, 45%)

HSB

hsb(330, 54%, 61%)

CMYK

cmyk(0%, 54%, 28%, 39%)

Oklch

oklch(52.0% 0.123 351.4)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#A47484

Dark Violet · Gray · Rose Pink

HEX

#A47484

RGB

rgb(164, 116, 132)

HSL

hsl(340, 21%, 55%)

HSB

hsb(340, 29%, 64%)

CMYK

cmyk(0%, 29%, 20%, 36%)

Oklch

oklch(61.2% 0.064 357.5)

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

#B29E92

Apricot · DarkGray · Warm Sun

HEX

#B29E92

RGB

rgb(178, 158, 146)

HSL

hsl(23, 17%, 64%)

HSB

hsb(23, 18%, 70%)

CMYK

cmyk(0%, 11%, 18%, 30%)

Oklch

oklch(71.3% 0.029 53.0)

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

#9AC5A7

Celadon · DarkSeaGreen · Apple Green

HEX

#9AC5A7

RGB

rgb(154, 197, 167)

HSL

hsl(138, 27%, 69%)

HSB

hsb(138, 22%, 77%)

CMYK

cmyk(22%, 0%, 15%, 23%)

Oklch

oklch(78.4% 0.062 154.3)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F85D62

5DF8F3

Analogous

F85DB0

F85D62

F8A65D

Triadic

F85D62

63F85D

5D63F8

Split-Comp.

F85D62

5DF8A6

5DB0F8

Tetradic

F85D62

B0F85D

5DF8F3

A65DF8

Contrast Matrix WCAG 2.1 Contrast

F85D62	9C4771	A47484	B29E92	9AC5A7
—	1.9 Fail	1.2 Fail	1.2 Fail	1.6 Fail
1.9 Fail	—	1.5 Fail	2.3 Fail	3.1 AA Large
1.2 Fail	1.5 Fail	—	1.5 Fail	2.0 Fail
1.2 Fail	2.3 Fail	1.5 Fail	—	1.3 Fail
1.6 Fail	3.1 AA Large	2.0 Fail	1.3 Fail	—

White BG

3.1AA Large

5.9AA

3.9AA Large

2.6Fail

1.9Fail

Black BG

6.7AA

3.6AA Large

5.4AA

8.2AAA

10.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B5B361

777667

8F8F80

A9A995

ADADAE

Deuteranopia

BECA61

7C8364

92967F

ABAC96

AAA7B0

Tritanopia

F06060

985F5D

A27D7C

B19798

9CB4B5

Achromatopsia

8C8C8C

656565

848484

A3A3A3

B5B5B5

Shades & Tints Shades & Tints

#F85D62

Dark

Light

#9C4771

Dark

Light

#A47484

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f85d62;
  --color-2: #9c4771;
  --color-3: #a47484;
  --color-4: #b29e92;
  --color-5: #9ac5a7;
}

SCSS

$color-1: #f85d62;
$color-2: #9c4771;
$color-3: #a47484;
$color-4: #b29e92;
$color-5: #9ac5a7;

TAILWIND

colors: {
  'brand-1': '#f85d62',
  'brand-2': '#9c4771',
  'brand-3': '#a47484',
  'brand-4': '#b29e92',
  'brand-5': '#9ac5a7',
}

RGB Array

[248, 93, 98], [156, 71, 113], [164, 116, 132], [178, 158, 146], [154, 197, 167]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #F85D62, #9C4771, #A47484, #B29E92, #9AC5A7 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: #f85d62; --color-2: #9c4771; --color-3: #a47484; --color-4: #b29e92; --color-5: #9ac5a7. 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 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