← Back to Editor

#7EE1AA · #F4E77F · #E68155 · #895740 · #322521

summer

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#7EE1AA

Emerald · MediumAquaMarine · Apple Green

HEX
#7EE1AA
RGB
rgb(126, 225, 170)
HSL
hsl(147, 62%, 69%)
HSB
hsb(147, 44%, 88%)
CMYK
cmyk(44%, 0%, 24%, 12%)
Oklch
oklch(83.4% 0.123 157.9)

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

#F4E77F

Fresh Green · Khaki · Sunflower

HEX
#F4E77F
RGB
rgb(244, 231, 127)
HSL
hsl(53, 84%, 73%)
HSB
hsb(53, 48%, 96%)
CMYK
cmyk(0%, 5%, 48%, 4%)
Oklch
oklch(91.7% 0.126 102.2)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#E68155

Apricot · Coral · Warm Sun

HEX
#E68155
RGB
rgb(230, 129, 85)
HSL
hsl(18, 74%, 62%)
HSB
hsb(18, 63%, 90%)
CMYK
cmyk(0%, 44%, 63%, 10%)
Oklch
oklch(70.5% 0.138 43.6)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#895740

Tangerine · Sienna · Amber Brown

HEX
#895740
RGB
rgb(137, 87, 64)
HSL
hsl(19, 36%, 39%)
HSB
hsb(19, 53%, 54%)
CMYK
cmyk(0%, 36%, 53%, 46%)
Oklch
oklch(50.7% 0.075 45.3)

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

#322521

Crimson · DarkSlateGray · Deep Berry

HEX
#322521
RGB
rgb(50, 37, 33)
HSL
hsl(14, 20%, 16%)
HSB
hsb(14, 34%, 20%)
CMYK
cmyk(0%, 26%, 34%, 80%)
Oklch
oklch(27.8% 0.021 37.8)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7EE1AA
E17FB5

Analogous

84E17F
7EE1AA
7FE1DC

Triadic

7EE1AA
AB7FE1
E1AB7F

Split-Comp.

7EE1AA
DC7FE1
E17F84

Tetradic

7EE1AA
7F84E1
E17FB5
E1DC7F

Contrast Matrix WCAG 2.1 Contrast

7EE1AA
F4E77F
E68155
895740
322521
—
1.3
Fail
1.7
Fail
3.8
AA Large
9.3
AAA
1.3
Fail
—
2.2
Fail
4.7
AA
11.7
AAA
1.7
Fail
2.2
Fail
—
2.2
Fail
5.4
AA
3.8
AA Large
4.7
AA
2.2
Fail
—
2.5
Fail
9.3
AAA
11.7
AAA
5.4
AA
2.5
Fail
—
White BG
1.6Fail
1.3Fail
2.8Fail
6.0AA
14.8AAA
Black BG
13.2AAA
16.6AAA
7.6AAA
3.5AA Large
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A9AAB7
EEEE98
BAB960
737346
2C2C22

Deuteranopia

A39CBB
EFF09E
C0C862
767A47
2D2E22

Tritanopia

83C2C4
F3ACB0
E1686A
874A4B
312323

Achromatopsia

BDBDBD
DFDFDF
9A9A9A
636363
282828

Shades & Tints Shades & Tints

#7EE1AA

Dark
Light

#F4E77F

Dark
Light

#E68155

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7ee1aa;
  --color-2: #f4e77f;
  --color-3: #e68155;
  --color-4: #895740;
  --color-5: #322521;
}

SCSS

$color-1: #7ee1aa;
$color-2: #f4e77f;
$color-3: #e68155;
$color-4: #895740;
$color-5: #322521;

TAILWIND

colors: {
  'brand-1': '#7ee1aa',
  'brand-2': '#f4e77f',
  'brand-3': '#e68155',
  'brand-4': '#895740',
  'brand-5': '#322521',
}

RGB Array

[126, 225, 170], [244, 231, 127], [230, 129, 85], [137, 87, 64], [50, 37, 33]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This summer-style palette of #7EE1AA, #F4E77F, #E68155, #895740, #322521 is ideal for: 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: #7ee1aa; --color-2: #f4e77f; --color-3: #e68155; --color-4: #895740; --color-5: #322521. 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 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