#3FCCA2 + #49DE94 + #7ADE98 + #AADE82 + #D4DE8C - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#3FCCA2

Mineral Blue · MediumAquaMarine · Lake Green

HEX

#3FCCA2

RGB

rgb(63, 204, 162)

HSL

hsl(162, 58%, 52%)

HSB

hsb(162, 69%, 80%)

CMYK

cmyk(69%, 0%, 21%, 20%)

Oklch

oklch(76.0% 0.134 168.8)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#49DE94

Mineral Blue · MediumAquaMarine · Olive Green

HEX

#49DE94

RGB

rgb(73, 222, 148)

HSL

hsl(150, 69%, 58%)

HSB

hsb(150, 67%, 87%)

CMYK

cmyk(67%, 0%, 33%, 13%)

Oklch

oklch(80.4% 0.165 157.4)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#7ADE98

Emerald · LightGreen · Apple Green

HEX

#7ADE98

RGB

rgb(122, 222, 152)

HSL

hsl(138, 60%, 67%)

HSB

hsb(138, 45%, 87%)

CMYK

cmyk(45%, 0%, 32%, 13%)

Oklch

oklch(82.2% 0.137 152.0)

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

#AADE82

Emerald · LightGreen · Apple Green

HEX

#AADE82

RGB

rgb(170, 222, 130)

HSL

hsl(94, 58%, 69%)

HSB

hsb(94, 41%, 87%)

CMYK

cmyk(23%, 0%, 41%, 13%)

Oklch

oklch(84.3% 0.132 132.7)

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

#D4DE8C

Fresh Green · Khaki · Sunflower

HEX

#D4DE8C

RGB

rgb(212, 222, 140)

HSL

hsl(67, 55%, 71%)

HSB

hsb(67, 37%, 87%)

CMYK

cmyk(5%, 0%, 37%, 13%)

Oklch

oklch(87.4% 0.105 114.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3FCCA2

CC3E68

Analogous

3ECC5A

3FCCA2

3EAFCC

Triadic

3FCCA2

A13ECC

CCA13E

Split-Comp.

3FCCA2

CC3EAF

CC5A3E

Tetradic

3FCCA2

5A3ECC

CC3E68

AFCC3E

Contrast Matrix WCAG 2.1 Contrast

3FCCA2	49DE94	7ADE98	AADE82	D4DE8C
—	1.2 Fail	1.2 Fail	1.3 Fail	1.4 Fail
1.2 Fail	—	1.0 Fail	1.1 Fail	1.2 Fail
1.2 Fail	1.0 Fail	—	1.1 Fail	1.1 Fail
1.3 Fail	1.1 Fail	1.1 Fail	—	1.1 Fail
1.4 Fail	1.2 Fail	1.1 Fail	1.1 Fail	—

White BG

2.0Fail

1.7Fail

1.6Fail

1.4Fail

Black BG

10.4AAA

12.2AAA

12.7AAA

13.5AAA

14.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7C7DAC

8A8BA6

A5A6A9

C1C198

D8D8A0

Deuteranopia

7469AF

8176AA

A098AD

BEBA9E

D8D7A5

Tritanopia

46B4B6

50B4B7

7FB6B9

ADAAAE

D4B0B3

Achromatopsia

9D9D9D

A9A9A9

B8B8B8

C4C4C4

D2D2D2

Shades & Tints Shades & Tints

#3FCCA2

Dark

Light

#49DE94

Dark

Light

#7ADE98

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3fcca2;
  --color-2: #49de94;
  --color-3: #7ade98;
  --color-4: #aade82;
  --color-5: #d4de8c;
}

SCSS

$color-1: #3fcca2;
$color-2: #49de94;
$color-3: #7ade98;
$color-4: #aade82;
$color-5: #d4de8c;

TAILWIND

colors: {
  'brand-1': '#3fcca2',
  'brand-2': '#49de94',
  'brand-3': '#7ade98',
  'brand-4': '#aade82',
  'brand-5': '#d4de8c',
}

RGB Array

[63, 204, 162], [73, 222, 148], [122, 222, 152], [170, 222, 130], [212, 222, 140]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3FCCA2, #49DE94, #7ADE98, #AADE82, #D4DE8C is ideal for: corporate websites, product showcases, portfolios. 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: #3fcca2; --color-2: #49de94; --color-3: #7ade98; --color-4: #aade82; --color-5: #d4de8c. 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. 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