#C5C6C1 + #AAC7B1 + #75E3A1 + #3FFF90 + #9A9A9A · bright - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C5C6C1

Silver Gray · Silver · Pearl Gray

HEX

#C5C6C1

RGB

rgb(197, 198, 193)

HSL

hsl(72, 4%, 77%)

HSB

hsb(72, 3%, 78%)

CMYK

cmyk(1%, 0%, 3%, 22%)

Oklch

oklch(82.4% 0.007 115.7)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

#AAC7B1

Celadon · Silver · Apple Green

HEX

#AAC7B1

RGB

rgb(170, 199, 177)

HSL

hsl(134, 21%, 72%)

HSB

hsb(134, 15%, 78%)

CMYK

cmyk(15%, 0%, 11%, 22%)

Oklch

oklch(80.2% 0.044 152.6)

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

#75E3A1

Emerald · MediumAquaMarine · Apple Green

HEX

#75E3A1

RGB

rgb(117, 227, 161)

HSL

hsl(144, 66%, 67%)

HSB

hsb(144, 48%, 89%)

CMYK

cmyk(48%, 0%, 29%, 11%)

Oklch

oklch(83.3% 0.139 155.5)

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

#3FFF90

Emerald · MediumSpringGreen · Apple Green

HEX

#3FFF90

RGB

rgb(63, 255, 144)

HSL

hsl(145, 100%, 62%)

HSB

hsb(145, 75%, 100%)

CMYK

cmyk(75%, 0%, 44%, 0%)

Oklch

oklch(88.3% 0.213 152.4)

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

#9A9A9A

Ash · DarkGray · Silver Sand

HEX

#9A9A9A

RGB

rgb(154, 154, 154)

HSL

hsl(0, 0%, 60%)

HSB

hsb(0, 0%, 60%)

CMYK

cmyk(0%, 0%, 0%, 40%)

Oklch

oklch(68.6% 0.000 89.9)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C5C6C1

C3C2C7

Analogous

C7C5C2

C5C6C1

C3C7C2

Triadic

C5C6C1

C2C6C7

C7C2C6

Split-Comp.

C5C6C1

C2C3C7

C5C2C7

Tetradic

C5C6C1

C2C7C5

C3C2C7

C7C2C3

Contrast Matrix WCAG 2.1 Contrast

C5C6C1	AAC7B1	75E3A1	3FFF90	9A9A9A
—	1.1 Fail	1.1 Fail	1.3 Fail	1.6 Fail
1.1 Fail	—	1.2 Fail	1.4 Fail	1.5 Fail
1.1 Fail	1.2 Fail	—	1.2 Fail	1.8 Fail
1.3 Fail	1.4 Fail	1.2 Fail	—	2.1 Fail
1.6 Fail	1.5 Fail	1.8 Fail	2.1 Fail	—

White BG

1.7Fail

1.8Fail

1.6Fail

1.3Fail

2.8Fail

Black BG

12.2AAA

11.5AAA

13.3AAA

15.9AAA

7.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C5C5C2

B7B7B6

A5A6B1

9294AB

9A9A9A

Deuteranopia

C5C5C3

B5B3B8

9E96B5

8779B1

9A9A9A

Tritanopia

C5C3C3

ABBBBB

7BBEC0

49C0C5

9A9A9A

Achromatopsia

C5C5C5

BCBCBC

BBBBBB

B9B9B9

9A9A9A

Shades & Tints Shades & Tints

#C5C6C1

Dark

Light

#AAC7B1

Dark

Light

#75E3A1

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c5c6c1;
  --color-2: #aac7b1;
  --color-3: #75e3a1;
  --color-4: #3fff90;
  --color-5: #9a9a9a;
}

SCSS

$color-1: #c5c6c1;
$color-2: #aac7b1;
$color-3: #75e3a1;
$color-4: #3fff90;
$color-5: #9a9a9a;

TAILWIND

colors: {
  'brand-1': '#c5c6c1',
  'brand-2': '#aac7b1',
  'brand-3': '#75e3a1',
  'brand-4': '#3fff90',
  'brand-5': '#9a9a9a',
}

RGB Array

[197, 198, 193], [170, 199, 177], [117, 227, 161], [63, 255, 144], [154, 154, 154]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #C5C6C1, #AAC7B1, #75E3A1, #3FFF90, #9A9A9A 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: #c5c6c1; --color-2: #aac7b1; --color-3: #75e3a1; --color-4: #3fff90; --color-5: #9a9a9a. 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 bright-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