← Back to Editor

#941818 · #EEF6EC · #E3F3E0 · #DDF1D9 · #3F1322

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#941818

Vermilion · Brown · Wine Red

HEX
#941818
RGB
rgb(148, 24, 24)
HSL
hsl(0, 72%, 34%)
HSB
hsb(0, 84%, 58%)
CMYK
cmyk(0%, 84%, 84%, 42%)
Oklch
oklch(43.2% 0.159 27.1)

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

#EEF6EC

Celadon · Linen · Mint Green

HEX
#EEF6EC
RGB
rgb(238, 246, 236)
HSL
hsl(108, 36%, 95%)
HSB
hsb(108, 4%, 96%)
CMYK
cmyk(3%, 0%, 4%, 4%)
Oklch
oklch(96.4% 0.016 139.4)

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

#E3F3E0

Celadon · Beige · Mint Green

HEX
#E3F3E0
RGB
rgb(227, 243, 224)
HSL
hsl(111, 44%, 92%)
HSB
hsb(111, 8%, 95%)
CMYK
cmyk(7%, 0%, 8%, 5%)
Oklch
oklch(94.7% 0.030 140.8)

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

#DDF1D9

Celadon · Beige · Mint Green

HEX
#DDF1D9
RGB
rgb(221, 241, 217)
HSL
hsl(110, 46%, 90%)
HSB
hsb(110, 10%, 95%)
CMYK
cmyk(8%, 0%, 10%, 5%)
Oklch
oklch(93.7% 0.038 140.5)

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

#3F1322

Dark Violet · Black · Raspberry

HEX
#3F1322
RGB
rgb(63, 19, 34)
HSL
hsl(340, 54%, 16%)
HSB
hsb(340, 70%, 25%)
CMYK
cmyk(0%, 70%, 46%, 75%)
Oklch
oklch(26.3% 0.071 2.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

941818
189595

Analogous

951857
941818
955718

Triadic

941818
189518
181895

Split-Comp.

941818
189557
185795

Tetradic

941818
579518
189595
571895

Contrast Matrix WCAG 2.1 Contrast

941818
EEF6EC
E3F3E0
DDF1D9
3F1322
—
7.9
AAA
7.6
AAA
7.3
AAA
1.8
Fail
7.9
AAA
—
1.0
Fail
1.1
Fail
14.3
AAA
7.6
AAA
1.0
Fail
—
1.0
Fail
13.7
AAA
7.3
AAA
1.1
Fail
1.0
Fail
—
13.3
AAA
1.8
Fail
14.3
AAA
13.7
AAA
13.3
AAA
—
White BG
8.7AAA
1.1Fail
1.2Fail
1.2Fail
15.8AAA
Black BG
2.4Fail
19.0AAA
18.2AAA
17.7AAA
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

5E5D18
F1F2EE
EAEAE5
E6E6DF
2C2C1E

Deuteranopia

666F18
F1F0EF
E9E8E6
E5E3E0
2F321D

Tritanopia

8E1818
EEF0F1
E4E8E9
DEE3E4
3D1C1B

Achromatopsia

3D3D3D
F2F2F2
ECECEC
E8E8E8
222222

Shades & Tints Shades & Tints

#941818

Dark
Light

#EEF6EC

Dark
Light

#E3F3E0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #941818;
  --color-2: #eef6ec;
  --color-3: #e3f3e0;
  --color-4: #ddf1d9;
  --color-5: #3f1322;
}

SCSS

$color-1: #941818;
$color-2: #eef6ec;
$color-3: #e3f3e0;
$color-4: #ddf1d9;
$color-5: #3f1322;

TAILWIND

colors: {
  'brand-1': '#941818',
  'brand-2': '#eef6ec',
  'brand-3': '#e3f3e0',
  'brand-4': '#ddf1d9',
  'brand-5': '#3f1322',
}

RGB Array

[148, 24, 24], [238, 246, 236], [227, 243, 224], [221, 241, 217], [63, 19, 34]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #941818, #EEF6EC, #E3F3E0, #DDF1D9, #3F1322 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: #941818; --color-2: #eef6ec; --color-3: #e3f3e0; --color-4: #ddf1d9; --color-5: #3f1322. 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