← Back to Editor

#8DCBC1 · #F7F5F4 · #E0DBCA · #EB7E12 · #F70A7C

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

#8DCBC1

Jade · SkyBlue · Lake Green

HEX
#8DCBC1
RGB
rgb(141, 203, 193)
HSL
hsl(170, 37%, 67%)
HSB
hsb(170, 31%, 80%)
CMYK
cmyk(31%, 0%, 5%, 20%)
Oklch
oklch(79.7% 0.065 183.5)

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

#F7F5F4

Apricot · SeaShell · Peach Orange

HEX
#F7F5F4
RGB
rgb(247, 245, 244)
HSL
hsl(20, 16%, 96%)
HSB
hsb(20, 1%, 97%)
CMYK
cmyk(0%, 1%, 1%, 3%)
Oklch
oklch(97.1% 0.003 48.7)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#E0DBCA

Goose Yellow · LightGray · Lemon Cream

HEX
#E0DBCA
RGB
rgb(224, 219, 202)
HSL
hsl(46, 26%, 84%)
HSB
hsb(46, 10%, 88%)
CMYK
cmyk(0%, 2%, 10%, 12%)
Oklch
oklch(89.1% 0.023 93.3)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#EB7E12

Ochre · Chocolate · Amber Brown

HEX
#EB7E12
RGB
rgb(235, 126, 18)
HSL
hsl(30, 86%, 50%)
HSB
hsb(30, 92%, 92%)
CMYK
cmyk(0%, 46%, 92%, 8%)
Oklch
oklch(70.2% 0.168 56.0)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#F70A7C

Dark Violet · DeepPink · Camellia

HEX
#F70A7C
RGB
rgb(247, 10, 124)
HSL
hsl(331, 94%, 50%)
HSB
hsb(331, 96%, 97%)
CMYK
cmyk(0%, 96%, 50%, 3%)
Oklch
oklch(63.2% 0.252 2.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8DCBC1
CA8C96

Analogous

8CCAA0
8DCBC1
8CB5CA

Triadic

8DCBC1
C08CCA
CAC08C

Split-Comp.

8DCBC1
CA8CB5
CAA08C

Tetradic

8DCBC1
A08CCA
CA8C96
B5CA8C

Contrast Matrix WCAG 2.1 Contrast

8DCBC1
F7F5F4
E0DBCA
EB7E12
F70A7C
—
1.7
Fail
1.3
Fail
1.5
Fail
2.2
Fail
1.7
Fail
—
1.3
Fail
2.6
Fail
3.7
AA Large
1.3
Fail
1.3
Fail
—
2.0
Fail
2.9
Fail
1.5
Fail
2.6
Fail
2.0
Fail
—
1.4
Fail
2.2
Fail
3.7
AA Large
2.9
Fail
1.4
Fail
—
White BG
1.8Fail
1.1Fail
1.4Fail
2.8Fail
4.0AA Large
Black BG
11.4AAA
19.3AAA
15.2AAA
7.5AAA
5.3AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A8A8C3
F6F6F4
DEDECE
BCBB2C
908E60

Deuteranopia

A4A0C4
F6F6F4
DEDFCF
C2CA32
9EB05A

Tritanopia

90C5C6
F7F4F4
E0D1D2
E64145
EB4B46

Achromatopsia

B7B7B7
F5F5F5
DBDBDB
929292
5E5E5E

Shades & Tints Shades & Tints

#8DCBC1

Dark
Light

#F7F5F4

Dark
Light

#E0DBCA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8dcbc1;
  --color-2: #f7f5f4;
  --color-3: #e0dbca;
  --color-4: #eb7e12;
  --color-5: #f70a7c;
}

SCSS

$color-1: #8dcbc1;
$color-2: #f7f5f4;
$color-3: #e0dbca;
$color-4: #eb7e12;
$color-5: #f70a7c;

TAILWIND

colors: {
  'brand-1': '#8dcbc1',
  'brand-2': '#f7f5f4',
  'brand-3': '#e0dbca',
  'brand-4': '#eb7e12',
  'brand-5': '#f70a7c',
}

RGB Array

[141, 203, 193], [247, 245, 244], [224, 219, 202], [235, 126, 18], [247, 10, 124]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8DCBC1, #F7F5F4, #E0DBCA, #EB7E12, #F70A7C 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: #8dcbc1; --color-2: #f7f5f4; --color-3: #e0dbca; --color-4: #eb7e12; --color-5: #f70a7c. 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