#63C5AE + #82B39A + #A1A186 + #C1CE56 + #E0FA25 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#63C5AE

Mineral Blue · MediumAquaMarine · Lake Green

HEX

#63C5AE

RGB

rgb(99, 197, 174)

HSL

hsl(166, 46%, 58%)

HSB

hsb(166, 50%, 77%)

CMYK

cmyk(50%, 0%, 12%, 23%)

Oklch

oklch(75.7% 0.099 176.2)

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

#82B39A

Celadon · DarkSeaGreen · Apple Green

HEX

#82B39A

RGB

rgb(130, 179, 154)

HSL

hsl(149, 24%, 61%)

HSB

hsb(149, 27%, 70%)

CMYK

cmyk(27%, 0%, 14%, 30%)

Oklch

oklch(72.5% 0.064 162.1)

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

#A1A186

Autumn Sage · DarkSeaGreen · Sunflower

HEX

#A1A186

RGB

rgb(161, 161, 134)

HSL

hsl(60, 13%, 58%)

HSB

hsb(60, 17%, 63%)

CMYK

cmyk(0%, 0%, 17%, 37%)

Oklch

oklch(70.2% 0.038 107.3)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#C1CE56

Autumn Sage · BurlyWood · Sunflower

HEX

#C1CE56

RGB

rgb(193, 206, 86)

HSL

hsl(67, 55%, 57%)

HSB

hsb(67, 58%, 81%)

CMYK

cmyk(6%, 0%, 58%, 19%)

Oklch

oklch(81.8% 0.145 114.8)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#E0FA25

Autumn Sage · Yellow · Sunflower

HEX

#E0FA25

RGB

rgb(224, 250, 37)

HSL

hsl(67, 96%, 56%)

HSB

hsb(67, 85%, 98%)

CMYK

cmyk(10%, 0%, 85%, 2%)

Oklch

oklch(93.4% 0.209 117.3)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

63C5AE

C5637A

Analogous

63C57D

63C5AE

63ABC5

Triadic

63C5AE

AE63C5

C5AE63

Split-Comp.

63C5AE

C563AB

C57D63

Tetradic

63C5AE

7D63C5

C5637A

ABC563

Contrast Matrix WCAG 2.1 Contrast

63C5AE	82B39A	A1A186	C1CE56	E0FA25
—	1.1 Fail	1.3 Fail	1.2 Fail	1.8 Fail
1.1 Fail	—	1.1 Fail	1.4 Fail	2.0 Fail
1.3 Fail	1.1 Fail	—	1.5 Fail	2.2 Fail
1.2 Fail	1.4 Fail	1.5 Fail	—	1.5 Fail
1.8 Fail	2.0 Fail	2.2 Fail	1.5 Fail	—

White BG

2.1Fail

2.4Fail

2.6Fail

1.7Fail

1.2Fail

Black BG

10.1AAA

8.9AAA

8.0AAA

12.2AAA

17.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8D8EB4

9798A0

A1A18D

C7C773

EBEB59

Deuteranopia

8880B5

9491A2

A1A18E

C6C57A

EAE865

Tritanopia

68B8B9

84A5A6

A19293

C28A8F

E1818A

Achromatopsia

A5A5A5

A1A1A1

9E9E9E

BCBCBC

DADADA

Shades & Tints Shades & Tints

#63C5AE

Dark

Light

#82B39A

Dark

Light

#A1A186

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #63c5ae;
  --color-2: #82b39a;
  --color-3: #a1a186;
  --color-4: #c1ce56;
  --color-5: #e0fa25;
}

SCSS

$color-1: #63c5ae;
$color-2: #82b39a;
$color-3: #a1a186;
$color-4: #c1ce56;
$color-5: #e0fa25;

TAILWIND

colors: {
  'brand-1': '#63c5ae',
  'brand-2': '#82b39a',
  'brand-3': '#a1a186',
  'brand-4': '#c1ce56',
  'brand-5': '#e0fa25',
}

RGB Array

[99, 197, 174], [130, 179, 154], [161, 161, 134], [193, 206, 86], [224, 250, 37]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #63C5AE, #82B39A, #A1A186, #C1CE56, #E0FA25 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: #63c5ae; --color-2: #82b39a; --color-3: #a1a186; --color-4: #c1ce56; --color-5: #e0fa25. 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