← Back to Editor

#E1F6DF · #E4DAF1 · #D99AF3 · #B2869F · #6D583B

earth

A 5-color earth 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

#E1F6DF

Emerald · Beige · Mint Green

HEX
#E1F6DF
RGB
rgb(225, 246, 223)
HSL
hsl(115, 56%, 92%)
HSB
hsb(115, 9%, 96%)
CMYK
cmyk(9%, 0%, 9%, 4%)
Oklch
oklch(95.2% 0.038 142.8)

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

#E4DAF1

Wisteria · Lavender · Lavender

HEX
#E4DAF1
RGB
rgb(228, 218, 241)
HSL
hsl(266, 45%, 90%)
HSB
hsb(266, 10%, 95%)
CMYK
cmyk(5%, 10%, 0%, 5%)
Oklch
oklch(90.3% 0.033 305.3)

Traditional「Wisteria」· Paint「Lavender」· Creative Lavender Dream

#D99AF3

Lilac · Violet · Lilac Purple

HEX
#D99AF3
RGB
rgb(217, 154, 243)
HSL
hsl(282, 79%, 78%)
HSB
hsb(282, 37%, 95%)
CMYK
cmyk(11%, 37%, 0%, 5%)
Oklch
oklch(77.8% 0.139 315.7)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

#B2869F

Mauve · DarkGray · Rose Pink

HEX
#B2869F
RGB
rgb(178, 134, 159)
HSL
hsl(326, 22%, 61%)
HSB
hsb(326, 25%, 70%)
CMYK
cmyk(0%, 25%, 11%, 30%)
Oklch
oklch(67.0% 0.063 343.9)

Traditional「Mauve」· Paint「Rose Pink」· Creative Rose Petal

#6D583B

Ochre · DarkOliveGreen · Amber Brown

HEX
#6D583B
RGB
rgb(109, 88, 59)
HSL
hsl(35, 30%, 33%)
HSB
hsb(35, 46%, 43%)
CMYK
cmyk(0%, 19%, 46%, 57%)
Oklch
oklch(47.4% 0.051 75.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E1F6DF
F4DFF6

Analogous

EDF6DF
E1F6DF
DFF6E9

Triadic

E1F6DF
DFE1F6
F6DFE1

Split-Comp.

E1F6DF
E9DFF6
F6DFED

Tetradic

E1F6DF
DFEDF6
F4DFF6
F6E9DF

Contrast Matrix WCAG 2.1 Contrast

E1F6DF
E4DAF1
D99AF3
B2869F
6D583B
—
1.2
Fail
1.9
Fail
2.7
Fail
5.9
AA
1.2
Fail
—
1.6
Fail
2.3
Fail
5.0
AA
1.9
Fail
1.6
Fail
—
1.5
Fail
3.2
AA Large
2.7
Fail
2.3
Fail
1.5
Fail
—
2.2
Fail
5.9
AA
5.0
AA
3.2
AA Large
2.2
Fail
—
White BG
1.1Fail
1.3Fail
2.1Fail
3.1AA Large
6.8AA
Black BG
18.4AAA
15.6AAA
9.9AAA
6.8AA
3.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

EAEAE5
E0E0EB
BEBDDD
9F9F99
646442

Deuteranopia

E9E7E6
E0E1EA
C1C6D8
A2A598
656744

Tritanopia

E2E9EA
E4E7E6
D6CCC9
B09493
6C4849

Achromatopsia

EDEDED
E0E0E0
B7B7B7
969696
5B5B5B

Shades & Tints Shades & Tints

#E1F6DF

Dark
Light

#E4DAF1

Dark
Light

#D99AF3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e1f6df;
  --color-2: #e4daf1;
  --color-3: #d99af3;
  --color-4: #b2869f;
  --color-5: #6d583b;
}

SCSS

$color-1: #e1f6df;
$color-2: #e4daf1;
$color-3: #d99af3;
$color-4: #b2869f;
$color-5: #6d583b;

TAILWIND

colors: {
  'brand-1': '#e1f6df',
  'brand-2': '#e4daf1',
  'brand-3': '#d99af3',
  'brand-4': '#b2869f',
  'brand-5': '#6d583b',
}

RGB Array

[225, 246, 223], [228, 218, 241], [217, 154, 243], [178, 134, 159], [109, 88, 59]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #E1F6DF, #E4DAF1, #D99AF3, #B2869F, #6D583B 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: #e1f6df; --color-2: #e4daf1; --color-3: #d99af3; --color-4: #b2869f; --color-5: #6d583b. 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 earth-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