← Back to Editor

#7CD0C0 · #1D8D80 · #E86D9E · #BCD281 · #E7F4AB

A 5-color palette 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

#7CD0C0

Jade · MediumAquaMarine · Lake Green

HEX
#7CD0C0
RGB
rgb(124, 208, 192)
HSL
hsl(169, 47%, 65%)
HSB
hsb(169, 40%, 82%)
CMYK
cmyk(40%, 0%, 8%, 18%)
Oklch
oklch(80.0% 0.086 180.4)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#1D8D80

Mineral Blue · Teal · Mint Ice

HEX
#1D8D80
RGB
rgb(29, 141, 128)
HSL
hsl(173, 66%, 33%)
HSB
hsb(173, 79%, 55%)
CMYK
cmyk(79%, 0%, 9%, 45%)
Oklch
oklch(58.1% 0.097 183.0)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#E86D9E

Rouge · LightCoral · Rose Pink

HEX
#E86D9E
RGB
rgb(232, 109, 158)
HSL
hsl(336, 73%, 67%)
HSB
hsb(336, 53%, 91%)
CMYK
cmyk(0%, 53%, 32%, 9%)
Oklch
oklch(69.4% 0.160 357.0)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#BCD281

Willow Green · Tan · Apple Green

HEX
#BCD281
RGB
rgb(188, 210, 129)
HSL
hsl(76, 47%, 66%)
HSB
hsb(76, 39%, 82%)
CMYK
cmyk(10%, 0%, 39%, 18%)
Oklch
oklch(82.9% 0.108 121.2)

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

#E7F4AB

Willow Green · Wheat · Mint Green

HEX
#E7F4AB
RGB
rgb(231, 244, 171)
HSL
hsl(71, 77%, 81%)
HSB
hsb(71, 30%, 96%)
CMYK
cmyk(5%, 0%, 30%, 4%)
Oklch
oklch(94.0% 0.094 116.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7CD0C0
D07C8B

Analogous

7CD096
7CD0C0
7CB5D0

Triadic

7CD0C0
C07CD0
D0C07C

Split-Comp.

7CD0C0
D07CB5
D0967C

Tetradic

7CD0C0
967CD0
D07C8B
B5D07C

Contrast Matrix WCAG 2.1 Contrast

7CD0C0
1D8D80
E86D9E
BCD281
E7F4AB
—
2.2
Fail
1.6
Fail
1.1
Fail
1.5
Fail
2.2
Fail
—
1.4
Fail
2.4
Fail
3.5
AA Large
1.6
Fail
1.4
Fail
—
1.8
Fail
2.5
Fail
1.1
Fail
2.4
Fail
1.8
Fail
—
1.4
Fail
1.5
Fail
3.5
AA Large
2.5
Fail
1.4
Fail
—
White BG
1.8Fail
4.1AA Large
3.0Fail
1.7Fail
1.2Fail
Black BG
11.6AAA
5.2AA
7.1AAA
12.7AAA
17.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A0A1C4
4D4F83
B3B292
C6C695
EDEDBD

Deuteranopia

9C95C5
473F84
BAC38F
C4C399
ECEBC1

Tritanopia

80C7C8
238686
E28987
BDA4A7
E8CBCE

Achromatopsia

B5B5B5
6A6A6A
979797
C2C2C2
E8E8E8

Shades & Tints Shades & Tints

#7CD0C0

Dark
Light

#1D8D80

Dark
Light

#E86D9E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7cd0c0;
  --color-2: #1d8d80;
  --color-3: #e86d9e;
  --color-4: #bcd281;
  --color-5: #e7f4ab;
}

SCSS

$color-1: #7cd0c0;
$color-2: #1d8d80;
$color-3: #e86d9e;
$color-4: #bcd281;
$color-5: #e7f4ab;

TAILWIND

colors: {
  'brand-1': '#7cd0c0',
  'brand-2': '#1d8d80',
  'brand-3': '#e86d9e',
  'brand-4': '#bcd281',
  'brand-5': '#e7f4ab',
}

RGB Array

[124, 208, 192], [29, 141, 128], [232, 109, 158], [188, 210, 129], [231, 244, 171]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7CD0C0, #1D8D80, #E86D9E, #BCD281, #E7F4AB 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: #7cd0c0; --color-2: #1d8d80; --color-3: #e86d9e; --color-4: #bcd281; --color-5: #e7f4ab. 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 general-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