← Back to Editor

#ED572D · #099C94 · #8BADAC · #D9D9D9 · #FFFFFF

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#ED572D

Vermilion · Tomato · Passion Red

HEX
#ED572D
RGB
rgb(237, 87, 45)
HSL
hsl(13, 84%, 55%)
HSB
hsb(13, 81%, 93%)
CMYK
cmyk(0%, 63%, 81%, 7%)
Oklch
oklch(65.1% 0.193 36.0)

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

#099C94

Mineral Blue · Teal · Mint Ice

HEX
#099C94
RGB
rgb(9, 156, 148)
HSL
hsl(177, 89%, 32%)
HSB
hsb(177, 94%, 61%)
CMYK
cmyk(94%, 0%, 5%, 39%)
Oklch
oklch(62.5% 0.107 188.3)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#8BADAC

Jade · DarkGray · Lake Green

HEX
#8BADAC
RGB
rgb(139, 173, 172)
HSL
hsl(178, 17%, 61%)
HSB
hsb(178, 20%, 68%)
CMYK
cmyk(20%, 0%, 1%, 32%)
Oklch
oklch(72.2% 0.037 194.1)

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

#D9D9D9

Silver Gray · LightGray · Pearl Gray

HEX
#D9D9D9
RGB
rgb(217, 217, 217)
HSL
hsl(0, 0%, 85%)
HSB
hsb(0, 0%, 85%)
CMYK
cmyk(0%, 0%, 0%, 15%)
Oklch
oklch(88.5% 0.000 89.9)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

#FFFFFF

Moonlight White · White · Cloud White

HEX
#FFFFFF
RGB
rgb(255, 255, 255)
HSL
hsl(0, 0%, 100%)
HSB
hsb(0, 0%, 100%)
CMYK
cmyk(0%, 0%, 0%, 0%)
Oklch
oklch(100.0% 0.000 89.9)

Traditional「Moonlight White」· Paint「Cloud White」· Creative Morning Mist

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ED572D
2CC3ED

Analogous

ED2C62
ED572D
EDB62C

Triadic

ED572D
2CED56
562CED

Split-Comp.

ED572D
2CEDB6
2C62ED

Tetradic

ED572D
62ED2C
2CC3ED
B62CED

Contrast Matrix WCAG 2.1 Contrast

ED572D
099C94
8BADAC
D9D9D9
FFFFFF
—
1.0
Fail
1.4
Fail
2.5
Fail
3.5
AA Large
1.0
Fail
—
1.4
Fail
2.4
Fail
3.4
AA Large
1.4
Fail
1.4
Fail
—
1.7
Fail
2.4
Fail
2.5
Fail
2.4
Fail
1.7
Fail
—
1.4
Fail
3.5
AA Large
3.4
AA Large
2.4
Fail
1.4
Fail
—
White BG
3.5AA Large
3.4AA Large
2.4Fail
1.4Fail
1.0Fail
Black BG
6.0AA
6.2AA
8.7AAA
14.9AAA
21.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

ACAB37
494A96
9A9AAC
D9D9D9
FFFFFF

Deuteranopia

B5C03A
403596
9895AC
D9D9D9
FFFFFF

Tritanopia

E53F41
109798
8DACAC
D9D9D9
FFFFFF

Achromatopsia

7F7F7F
6F6F6F
A3A3A3
D9D9D9
FFFFFF

Shades & Tints Shades & Tints

#ED572D

Dark
Light

#099C94

Dark
Light

#8BADAC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ed572d;
  --color-2: #099c94;
  --color-3: #8badac;
  --color-4: #d9d9d9;
  --color-5: #ffffff;
}

SCSS

$color-1: #ed572d;
$color-2: #099c94;
$color-3: #8badac;
$color-4: #d9d9d9;
$color-5: #ffffff;

TAILWIND

colors: {
  'brand-1': '#ed572d',
  'brand-2': '#099c94',
  'brand-3': '#8badac',
  'brand-4': '#d9d9d9',
  'brand-5': '#ffffff',
}

RGB Array

[237, 87, 45], [9, 156, 148], [139, 173, 172], [217, 217, 217], [255, 255, 255]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #ED572D, #099C94, #8BADAC, #D9D9D9, #FFFFFF is ideal for: health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #ed572d; --color-2: #099c94; --color-3: #8badac; --color-4: #d9d9d9; --color-5: #ffffff. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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