← Back to Editor

#F1F7DE · #E5F0C3 · #CCD6AA · #791052 · #BE38A8

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

#F1F7DE

Willow Green · Beige · Mint Green

HEX
#F1F7DE
RGB
rgb(241, 247, 222)
HSL
hsl(74, 61%, 92%)
HSB
hsb(74, 10%, 97%)
CMYK
cmyk(2%, 0%, 10%, 3%)
Oklch
oklch(96.5% 0.033 118.0)

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

#E5F0C3

Willow Green · Bisque · Mint Green

HEX
#E5F0C3
RGB
rgb(229, 240, 195)
HSL
hsl(75, 60%, 85%)
HSB
hsb(75, 19%, 94%)
CMYK
cmyk(5%, 0%, 19%, 6%)
Oklch
oklch(93.5% 0.060 118.7)

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

#CCD6AA

Willow Green · Silver · Apple Green

HEX
#CCD6AA
RGB
rgb(204, 214, 170)
HSL
hsl(74, 35%, 75%)
HSB
hsb(74, 21%, 84%)
CMYK
cmyk(5%, 0%, 21%, 16%)
Oklch
oklch(85.7% 0.060 118.1)

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

#791052

Rose Purple · Purple · Camellia

HEX
#791052
RGB
rgb(121, 16, 82)
HSL
hsl(322, 77%, 27%)
HSB
hsb(322, 87%, 47%)
CMYK
cmyk(0%, 87%, 32%, 53%)
Oklch
oklch(38.9% 0.150 348.5)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

#BE38A8

Rose Purple · MediumVioletRed · Violet

HEX
#BE38A8
RGB
rgb(190, 56, 168)
HSL
hsl(310, 54%, 48%)
HSB
hsb(310, 71%, 75%)
CMYK
cmyk(0%, 71%, 12%, 25%)
Oklch
oklch(57.7% 0.207 335.3)

Traditional「Rose Purple」· Paint「Violet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F1F7DE
E4DEF7

Analogous

F7F0DE
F1F7DE
E5F7DE

Triadic

F1F7DE
DEF1F7
F7DEF1

Split-Comp.

F1F7DE
DEE5F7
F0DEF7

Tetradic

F1F7DE
DEF7F0
E4DEF7
F7DEE5

Contrast Matrix WCAG 2.1 Contrast

F1F7DE
E5F0C3
CCD6AA
791052
BE38A8
—
1.1
Fail
1.4
Fail
9.5
AAA
4.4
AA Large
1.1
Fail
—
1.3
Fail
8.8
AAA
4.1
AA Large
1.4
Fail
1.3
Fail
—
6.9
AA
3.2
AA Large
9.5
AAA
8.8
AAA
6.9
AA
—
2.2
Fail
4.4
AA Large
4.1
AA Large
3.2
AA Large
2.2
Fail
—
White BG
1.1Fail
1.2Fail
1.5Fail
10.5AAA
4.9AA
Black BG
19.1AAA
17.6AAA
13.8AAA
2.0Fail
4.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

F4F4E4
EAEACE
D0D0B5
4C4B42
84838D

Deuteranopia

F3F3E5
E9E8D1
D0CFB7
52593E
8C9686

Tritanopia

F1E9EA
E6D6D8
CCBDBF
743533
B77873

Achromatopsia

F2F2F2
E8E8E8
CECECE
373737
6D6D6D

Shades & Tints Shades & Tints

#F1F7DE

Dark
Light

#E5F0C3

Dark
Light

#CCD6AA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f1f7de;
  --color-2: #e5f0c3;
  --color-3: #ccd6aa;
  --color-4: #791052;
  --color-5: #be38a8;
}

SCSS

$color-1: #f1f7de;
$color-2: #e5f0c3;
$color-3: #ccd6aa;
$color-4: #791052;
$color-5: #be38a8;

TAILWIND

colors: {
  'brand-1': '#f1f7de',
  'brand-2': '#e5f0c3',
  'brand-3': '#ccd6aa',
  'brand-4': '#791052',
  'brand-5': '#be38a8',
}

RGB Array

[241, 247, 222], [229, 240, 195], [204, 214, 170], [121, 16, 82], [190, 56, 168]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F1F7DE, #E5F0C3, #CCD6AA, #791052, #BE38A8 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: #f1f7de; --color-2: #e5f0c3; --color-3: #ccd6aa; --color-4: #791052; --color-5: #be38a8. 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