#F60554 + #789A99 + #91C1B5 + #DEE7C8 + #EDF8C0 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F60554

Dark Violet · Crimson · Camellia

HEX

#F60554

RGB

rgb(246, 5, 84)

HSL

hsl(340, 96%, 49%)

HSB

hsb(340, 98%, 96%)

CMYK

cmyk(0%, 98%, 66%, 4%)

Oklch

oklch(62.0% 0.246 14.9)

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

#789A99

Mineral Blue · LightSlateGray · Lake Green

HEX

#789A99

RGB

rgb(120, 154, 153)

HSL

hsl(178, 14%, 54%)

HSB

hsb(178, 22%, 60%)

CMYK

cmyk(22%, 0%, 1%, 40%)

Oklch

oklch(66.0% 0.038 194.0)

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

#91C1B5

Jade · DarkGray · Lake Green

HEX

#91C1B5

RGB

rgb(145, 193, 181)

HSL

hsl(165, 28%, 66%)

HSB

hsb(165, 25%, 76%)

CMYK

cmyk(25%, 0%, 6%, 24%)

Oklch

oklch(77.3% 0.053 177.7)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#DEE7C8

Willow Green · LightGray · Mint Green

HEX

#DEE7C8

RGB

rgb(222, 231, 200)

HSL

hsl(77, 39%, 85%)

HSB

hsb(77, 13%, 91%)

CMYK

cmyk(4%, 0%, 13%, 9%)

Oklch

oklch(91.3% 0.042 120.4)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

#EDF8C0

Willow Green · Bisque · Mint Green

HEX

#EDF8C0

RGB

rgb(237, 248, 192)

HSL

hsl(72, 80%, 86%)

HSB

hsb(72, 23%, 97%)

CMYK

cmyk(4%, 0%, 23%, 3%)

Oklch

oklch(95.7% 0.073 116.8)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F60554

05F5A5

Analogous

F505CD

F60554

F52D05

Triadic

F60554

55F505

0555F5

Split-Comp.

F60554

05F52D

05CDF5

Tetradic

F60554

CDF505

05F5A5

2D05F5

Contrast Matrix WCAG 2.1 Contrast

F60554	789A99	91C1B5	DEE7C8	EDF8C0
—	1.4 Fail	2.1 Fail	3.2 AA Large	3.7 AA Large
1.4 Fail	—	1.5 Fail	2.4 Fail	2.7 Fail
2.1 Fail	1.5 Fail	—	1.6 Fail	1.8 Fail
3.2 AA Large	2.4 Fail	1.6 Fail	—	1.1 Fail
3.7 AA Large	2.7 Fail	1.8 Fail	1.1 Fail	—

White BG

4.1AA Large

3.1AA Large

2.0Fail

1.3Fail

1.1Fail

Black BG

5.1AA

6.9AA

10.5AAA

16.4AAA

18.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8E8B41

878799

A6A6B8

E2E2D0

F2F2CE

Deuteranopia

9CAE3C

858299

A39FB9

E1E1D1

F1F0D1

Tritanopia

EA322E

7A9999

93BABB

DED5D7

EED8DB

Achromatopsia

565656

909090

B1B1B1

E1E1E1

EEEEEE

Shades & Tints Shades & Tints

#F60554

Dark

Light

#789A99

Dark

Light

#91C1B5

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f60554;
  --color-2: #789a99;
  --color-3: #91c1b5;
  --color-4: #dee7c8;
  --color-5: #edf8c0;
}

SCSS

$color-1: #f60554;
$color-2: #789a99;
$color-3: #91c1b5;
$color-4: #dee7c8;
$color-5: #edf8c0;

TAILWIND

colors: {
  'brand-1': '#f60554',
  'brand-2': '#789a99',
  'brand-3': '#91c1b5',
  'brand-4': '#dee7c8',
  'brand-5': '#edf8c0',
}

RGB Array

[246, 5, 84], [120, 154, 153], [145, 193, 181], [222, 231, 200], [237, 248, 192]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F60554, #789A99, #91C1B5, #DEE7C8, #EDF8C0 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: #f60554; --color-2: #789a99; --color-3: #91c1b5; --color-4: #dee7c8; --color-5: #edf8c0. 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