← Back to Editor

#FFFCF4 · #C2F5C8 · #6AAC70 · #1E193B · #C1004D

summer

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#FFFCF4

Goose Yellow · Snow · Lemon Cream

HEX
#FFFCF4
RGB
rgb(255, 252, 244)
HSL
hsl(44, 100%, 98%)
HSB
hsb(44, 4%, 100%)
CMYK
cmyk(0%, 1%, 4%, 0%)
Oklch
oklch(99.1% 0.011 89.7)

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

#C2F5C8

Emerald · LightGray · Mint Green

HEX
#C2F5C8
RGB
rgb(194, 245, 200)
HSL
hsl(127, 72%, 86%)
HSB
hsb(127, 21%, 96%)
CMYK
cmyk(21%, 0%, 18%, 4%)
Oklch
oklch(92.3% 0.080 148.1)

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

#6AAC70

Celadon · MediumSeaGreen · Olive Green

HEX
#6AAC70
RGB
rgb(106, 172, 112)
HSL
hsl(125, 28%, 55%)
HSB
hsb(125, 38%, 67%)
CMYK
cmyk(38%, 0%, 35%, 33%)
Oklch
oklch(68.4% 0.110 146.4)

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

#1E193B

Deep Indigo · MidnightBlue · Deep Sea Blue

HEX
#1E193B
RGB
rgb(30, 25, 59)
HSL
hsl(249, 40%, 16%)
HSB
hsb(249, 58%, 23%)
CMYK
cmyk(49%, 58%, 0%, 77%)
Oklch
oklch(24.0% 0.063 287.4)

Traditional「Deep Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#C1004D

Dark Violet · Crimson · Camellia

HEX
#C1004D
RGB
rgb(193, 0, 77)
HSL
hsl(336, 100%, 38%)
HSB
hsb(336, 100%, 76%)
CMYK
cmyk(0%, 100%, 60%, 24%)
Oklch
oklch(51.8% 0.207 9.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFFCF4
F5F8FF

Analogous

FFF7F5
FFFCF4
FDFFF5

Triadic

FFFCF4
F5FFFC
FCF5FF

Split-Comp.

FFFCF4
F5FDFF
F7F5FF

Tetradic

FFFCF4
F5FFF7
F5F8FF
FFF5FD

Contrast Matrix WCAG 2.1 Contrast

FFFCF4
C2F5C8
6AAC70
1E193B
C1004D
—
1.2
Fail
2.6
Fail
16.3
AAA
6.1
AA
1.2
Fail
—
2.2
Fail
13.7
AAA
5.1
AA
2.6
Fail
2.2
Fail
—
6.2
AA
2.3
Fail
16.3
AAA
13.7
AAA
6.2
AA
—
2.7
Fail
6.1
AA
5.1
AA
2.3
Fail
2.7
Fail
—
White BG
1.0Fail
1.2Fail
2.7Fail
16.7AAA
6.2AA
Black BG
20.5AAA
17.2AAA
7.7AAA
1.3Fail
3.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

FEFEF6
D8D9D3
87877F
1C1C33
6D6C3A

Deuteranopia

FEFEF6
D5D1D6
837E82
1C1D31
798736

Tritanopia

FFF7F8
C5DBDD
6D8A8D
1E2C2B
B72C28

Achromatopsia

FCFCFC
E1E1E1
919191
1E1E1E
424242

Shades & Tints Shades & Tints

#FFFCF4

Dark
Light

#C2F5C8

Dark
Light

#6AAC70

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fffcf4;
  --color-2: #c2f5c8;
  --color-3: #6aac70;
  --color-4: #1e193b;
  --color-5: #c1004d;
}

SCSS

$color-1: #fffcf4;
$color-2: #c2f5c8;
$color-3: #6aac70;
$color-4: #1e193b;
$color-5: #c1004d;

TAILWIND

colors: {
  'brand-1': '#fffcf4',
  'brand-2': '#c2f5c8',
  'brand-3': '#6aac70',
  'brand-4': '#1e193b',
  'brand-5': '#c1004d',
}

RGB Array

[255, 252, 244], [194, 245, 200], [106, 172, 112], [30, 25, 59], [193, 0, 77]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This summer-style palette of #FFFCF4, #C2F5C8, #6AAC70, #1E193B, #C1004D is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #fffcf4; --color-2: #c2f5c8; --color-3: #6aac70; --color-4: #1e193b; --color-5: #c1004d. 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 summer-style 5-color scheme is especially suited for food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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