← Back to Editor

#6FE392 · #84E8CF · #7DBDE8 · #B297DE · #B0617E

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

WorkspaceReading

Color Details Color Details

#6FE392

Emerald · MediumAquaMarine · Apple Green

HEX
#6FE392
RGB
rgb(111, 227, 146)
HSL
hsl(138, 67%, 66%)
HSB
hsb(138, 51%, 89%)
CMYK
cmyk(51%, 0%, 36%, 11%)
Oklch
oklch(82.8% 0.156 151.4)

TraditionalEmerald」· PaintApple Green」· Creative Mint Breeze

#84E8CF

Jade · SkyBlue · Lake Green

HEX
#84E8CF
RGB
rgb(132, 232, 207)
HSL
hsl(165, 68%, 71%)
HSB
hsb(165, 43%, 91%)
CMYK
cmyk(43%, 0%, 11%, 9%)
Oklch
oklch(86.3% 0.101 175.8)

TraditionalJade」· PaintLake Green」· Creative Arctic Pool

#7DBDE8

Sky Blue · SkyBlue · Cobalt Blue

HEX
#7DBDE8
RGB
rgb(125, 189, 232)
HSL
hsl(204, 70%, 70%)
HSB
hsb(204, 46%, 91%)
CMYK
cmyk(46%, 19%, 0%, 9%)
Oklch
oklch(77.1% 0.090 238.9)

TraditionalSky Blue」· PaintCobalt Blue」· Creative Twilight Haze

#B297DE

Wisteria · LightSteelBlue · Lilac Purple

HEX
#B297DE
RGB
rgb(178, 151, 222)
HSL
hsl(263, 52%, 73%)
HSB
hsb(263, 32%, 87%)
CMYK
cmyk(20%, 32%, 0%, 13%)
Oklch
oklch(72.7% 0.105 301.3)

TraditionalWisteria」· PaintLilac Purple」· Creative Lavender Dream

#B0617E

Dark Violet · Gray · Rose Pink

HEX
#B0617E
RGB
rgb(176, 97, 126)
HSL
hsl(338, 33%, 54%)
HSB
hsb(338, 45%, 69%)
CMYK
cmyk(0%, 45%, 28%, 31%)
Oklch
oklch(59.2% 0.107 357.5)

TraditionalDark Violet」· PaintRose Pink」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6FE392
E26EC0

Analogous

85E26E
6FE392
6EE2CB

Triadic

6FE392
916EE2
E2916E

Split-Comp.

6FE392
CB6EE2
E26E85

Tetradic

6FE392
6E85E2
E26EC0
E2CB6E

Contrast Matrix WCAG 2.1 Contrast

6FE392
84E8CF
7DBDE8
B297DE
B0617E
1.1
Fail
1.3
Fail
1.6
Fail
2.7
Fail
1.1
Fail
1.4
Fail
1.7
Fail
3.0
Fail
1.3
Fail
1.4
Fail
1.2
Fail
2.1
Fail
1.6
Fail
1.7
Fail
1.2
Fail
1.7
Fail
2.7
Fail
3.0
Fail
2.1
Fail
1.7
Fail
White BG
1.6Fail
1.5Fail
2.0Fail
2.5Fail
4.3AA Large
Black BG
13.1AAA
14.4AAA
10.3AAA
8.4AAA
4.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A1A2A6
AFB0D5
9999DE
A6A6CD
8E8D77

Deuteranopia

9B92AA
AAA2D6
9590DB
A8AAC9
929875

Tritanopia

75B5B8
89DADB
80D5D4
B1BFBC
AC7170

Achromatopsia

B7B7B7
C7C7C7
AFAFAF
A7A7A7
7C7C7C

Shades & Tints Shades & Tints

#6FE392

Dark
Light

#84E8CF

Dark
Light

#7DBDE8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6fe392;
  --color-2: #84e8cf;
  --color-3: #7dbde8;
  --color-4: #b297de;
  --color-5: #b0617e;
}

SCSS

$color-1: #6fe392;
$color-2: #84e8cf;
$color-3: #7dbde8;
$color-4: #b297de;
$color-5: #b0617e;

TAILWIND

colors: {
  'brand-1': '#6fe392',
  'brand-2': '#84e8cf',
  'brand-3': '#7dbde8',
  'brand-4': '#b297de',
  'brand-5': '#b0617e',
}

RGB Array

[111, 227, 146], [132, 232, 207], [125, 189, 232], [178, 151, 222], [176, 97, 126]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #6FE392, #84E8CF, #7DBDE8, #B297DE, #B0617E is ideal for: health products, baby brands, fresh-style blogs. 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: #6fe392; --color-2: #84e8cf; --color-3: #7dbde8; --color-4: #b297de; --color-5: #b0617e. 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. 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