← Back to Editor

#327CCB · #94BA65 · #C7BA99 · #EAE4D3 · #F4F0E6

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

#327CCB

Indigo · SteelBlue · Navy Blue

HEX
#327CCB
RGB
rgb(50, 124, 203)
HSL
hsl(211, 60%, 50%)
HSB
hsb(211, 75%, 80%)
CMYK
cmyk(75%, 39%, 0%, 20%)
Oklch
oklch(58.0% 0.142 252.8)

Traditional「Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#94BA65

Grass Green · DarkSeaGreen · Olive Green

HEX
#94BA65
RGB
rgb(148, 186, 101)
HSL
hsl(87, 38%, 56%)
HSB
hsb(87, 46%, 73%)
CMYK
cmyk(20%, 0%, 46%, 27%)
Oklch
oklch(74.2% 0.120 128.7)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#C7BA99

Ginger · Tan · Sunflower

HEX
#C7BA99
RGB
rgb(199, 186, 153)
HSL
hsl(43, 29%, 69%)
HSB
hsb(43, 23%, 78%)
CMYK
cmyk(0%, 7%, 23%, 22%)
Oklch
oklch(79.1% 0.047 89.1)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#EAE4D3

Goose Yellow · Beige · Lemon Cream

HEX
#EAE4D3
RGB
rgb(234, 228, 211)
HSL
hsl(44, 35%, 87%)
HSB
hsb(44, 10%, 92%)
CMYK
cmyk(0%, 3%, 10%, 8%)
Oklch
oklch(91.9% 0.024 90.8)

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

#F4F0E6

Goose Yellow · Linen · Lemon Cream

HEX
#F4F0E6
RGB
rgb(244, 240, 230)
HSL
hsl(43, 39%, 93%)
HSB
hsb(43, 6%, 96%)
CMYK
cmyk(0%, 2%, 6%, 4%)
Oklch
oklch(95.5% 0.014 88.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

327CCB
CC8233

Analogous

33C9CC
327CCB
3633CC

Triadic

327CCB
CC337D
7DCC33

Split-Comp.

327CCB
CC3633
C9CC33

Tetradic

327CCB
CC33C9
CC8233
33CC36

Contrast Matrix WCAG 2.1 Contrast

327CCB
94BA65
C7BA99
EAE4D3
F4F0E6
—
1.9
Fail
2.2
Fail
3.4
AA Large
3.8
AA Large
1.9
Fail
—
1.2
Fail
1.7
Fail
1.9
Fail
2.2
Fail
1.2
Fail
—
1.5
Fail
1.7
Fail
3.4
AA Large
1.7
Fail
1.5
Fail
—
1.1
Fail
3.8
AA Large
1.9
Fail
1.7
Fail
1.1
Fail
—
White BG
4.3AA Large
2.2Fail
1.9Fail
1.3Fail
1.1Fail
Black BG
4.9AA
9.5AAA
10.9AAA
16.5AAA
18.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5253B8
A4A57A
C1C1A1
E7E7D7
F2F2E8

Deuteranopia

4E48B3
A29F7E
C2C3A3
E8E8D8
F3F3E9

Tritanopia

36A9A5
968A8D
C6A7A9
EADADB
F4EAEB

Achromatopsia

6F6F6F
A5A5A5
BABABA
E4E4E4
F0F0F0

Shades & Tints Shades & Tints

#327CCB

Dark
Light

#94BA65

Dark
Light

#C7BA99

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #327ccb;
  --color-2: #94ba65;
  --color-3: #c7ba99;
  --color-4: #eae4d3;
  --color-5: #f4f0e6;
}

SCSS

$color-1: #327ccb;
$color-2: #94ba65;
$color-3: #c7ba99;
$color-4: #eae4d3;
$color-5: #f4f0e6;

TAILWIND

colors: {
  'brand-1': '#327ccb',
  'brand-2': '#94ba65',
  'brand-3': '#c7ba99',
  'brand-4': '#eae4d3',
  'brand-5': '#f4f0e6',
}

RGB Array

[50, 124, 203], [148, 186, 101], [199, 186, 153], [234, 228, 211], [244, 240, 230]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #327CCB, #94BA65, #C7BA99, #EAE4D3, #F4F0E6 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: #327ccb; --color-2: #94ba65; --color-3: #c7ba99; --color-4: #eae4d3; --color-5: #f4f0e6. 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