← Back to Editor

#D0EFC3 · #8EB8A2 · #B07F82 · #A9544F · #C4230F

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#D0EFC3

Emerald · LightGray · Mint Green

HEX
#D0EFC3
RGB
rgb(208, 239, 195)
HSL
hsl(102, 58%, 85%)
HSB
hsb(102, 18%, 94%)
CMYK
cmyk(13%, 0%, 18%, 6%)
Oklch
oklch(91.8% 0.067 136.5)

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

#8EB8A2

Celadon · DarkSeaGreen · Apple Green

HEX
#8EB8A2
RGB
rgb(142, 184, 162)
HSL
hsl(149, 23%, 64%)
HSB
hsb(149, 23%, 72%)
CMYK
cmyk(23%, 0%, 12%, 28%)
Oklch
oklch(74.6% 0.055 161.9)

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

#B07F82

Crimson · Gray · Passion Red

HEX
#B07F82
RGB
rgb(176, 127, 130)
HSL
hsl(356, 24%, 59%)
HSB
hsb(356, 28%, 69%)
CMYK
cmyk(0%, 28%, 26%, 31%)
Oklch
oklch(64.6% 0.061 14.8)

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

#A9544F

Crimson · Sienna · Passion Red

HEX
#A9544F
RGB
rgb(169, 84, 79)
HSL
hsl(3, 36%, 49%)
HSB
hsb(3, 53%, 66%)
CMYK
cmyk(0%, 50%, 53%, 34%)
Oklch
oklch(54.8% 0.113 24.9)

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

#C4230F

Vermilion · FireBrick · Passion Red

HEX
#C4230F
RGB
rgb(196, 35, 15)
HSL
hsl(7, 86%, 41%)
HSB
hsb(7, 92%, 77%)
CMYK
cmyk(0%, 82%, 92%, 23%)
Oklch
oklch(53.0% 0.198 30.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D0EFC3
E2C3EF

Analogous

E6EFC3
D0EFC3
C3EFCB

Triadic

D0EFC3
C3D0EF
EFC3D0

Split-Comp.

D0EFC3
CBC3EF
EFC3E6

Tetradic

D0EFC3
C3E6EF
E2C3EF
EFCBC3

Contrast Matrix WCAG 2.1 Contrast

D0EFC3
8EB8A2
B07F82
A9544F
C4230F
—
1.8
Fail
2.7
Fail
4.1
AA Large
4.7
AA
1.8
Fail
—
1.5
Fail
2.3
Fail
2.7
Fail
2.7
Fail
1.5
Fail
—
1.5
Fail
1.7
Fail
4.1
AA Large
2.3
Fail
1.5
Fail
—
1.1
Fail
4.7
AA
2.7
Fail
1.7
Fail
1.1
Fail
—
White BG
1.2Fail
2.2Fail
3.4AA Large
5.2AA
5.8AA
Black BG
16.8AAA
9.5AAA
6.2AA
4.1AA Large
3.6AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDECE
A0A1A7
9B9A81
848350
7E7D14

Deuteranopia

DCD9D0
9E9BA9
9EA181
899051
889415

Tritanopia

D2D6D8
90ACAC
AE8181
A55151
BC1819

Achromatopsia

E1E1E1
A9A9A9
8E8E8E
6D6D6D
515151

Shades & Tints Shades & Tints

#D0EFC3

Dark
Light

#8EB8A2

Dark
Light

#B07F82

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d0efc3;
  --color-2: #8eb8a2;
  --color-3: #b07f82;
  --color-4: #a9544f;
  --color-5: #c4230f;
}

SCSS

$color-1: #d0efc3;
$color-2: #8eb8a2;
$color-3: #b07f82;
$color-4: #a9544f;
$color-5: #c4230f;

TAILWIND

colors: {
  'brand-1': '#d0efc3',
  'brand-2': '#8eb8a2',
  'brand-3': '#b07f82',
  'brand-4': '#a9544f',
  'brand-5': '#c4230f',
}

RGB Array

[208, 239, 195], [142, 184, 162], [176, 127, 130], [169, 84, 79], [196, 35, 15]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D0EFC3, #8EB8A2, #B07F82, #A9544F, #C4230F is ideal for: 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: #d0efc3; --color-2: #8eb8a2; --color-3: #b07f82; --color-4: #a9544f; --color-5: #c4230f. 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. 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