#7AFFC5 + #72D5A8 + #6BAB8B + #63816D + #5B5750 · space - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#7AFFC5

Jade · LightGreen · Apple Green

HEX

#7AFFC5

RGB

rgb(122, 255, 197)

HSL

hsl(154, 100%, 74%)

HSB

hsb(154, 52%, 100%)

CMYK

cmyk(52%, 0%, 23%, 0%)

Oklch

oklch(90.9% 0.144 162.7)

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

#72D5A8

Jade · MediumAquaMarine · Apple Green

HEX

#72D5A8

RGB

rgb(114, 213, 168)

HSL

hsl(153, 54%, 64%)

HSB

hsb(153, 46%, 84%)

CMYK

cmyk(46%, 0%, 21%, 16%)

Oklch

oklch(80.0% 0.115 162.6)

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

#6BAB8B

Mineral Blue · CadetBlue · Olive Green

HEX

#6BAB8B

RGB

rgb(107, 171, 139)

HSL

hsl(150, 28%, 55%)

HSB

hsb(150, 37%, 67%)

CMYK

cmyk(37%, 0%, 19%, 33%)

Oklch

oklch(68.9% 0.082 161.5)

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

#63816D

Celadon · DimGray · Olive Green

HEX

#63816D

RGB

rgb(99, 129, 109)

HSL

hsl(140, 13%, 45%)

HSB

hsb(140, 23%, 51%)

CMYK

cmyk(23%, 0%, 16%, 49%)

Oklch

oklch(57.4% 0.046 155.5)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#5B5750

Ink Gray · DimGray · Charcoal

HEX

#5B5750

RGB

rgb(91, 87, 80)

HSL

hsl(38, 6%, 34%)

HSB

hsb(38, 12%, 36%)

CMYK

cmyk(0%, 4%, 12%, 64%)

Oklch

oklch(45.8% 0.012 81.8)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7AFFC5

FF7AB4

Analogous

7AFF83

7AFFC5

7AF6FF

Triadic

7AFFC5

C67AFF

FFC67A

Split-Comp.

7AFFC5

FF7AF6

FF837A

Tetradic

7AFFC5

837AFF

FF7AB4

F6FF7A

Contrast Matrix WCAG 2.1 Contrast

7AFFC5	72D5A8	6BAB8B	63816D	5B5750
—	1.4 Fail	2.2 Fail	3.5 AA Large	5.8 AA
1.4 Fail	—	1.5 Fail	2.4 Fail	4.0 AA Large
2.2 Fail	1.5 Fail	—	1.6 Fail	2.7 Fail
3.5 AA Large	2.4 Fail	1.6 Fail	—	1.7 Fail
5.8 AA	4.0 AA Large	2.7 Fail	1.7 Fail	—

White BG

1.2Fail

1.8Fail

2.7Fail

4.3AA Large

7.2AAA

Black BG

16.9AAA

11.8AAA

7.8AAA

4.9AA

2.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B4B5D3

9D9EB3

878793

707072

595952

Deuteranopia

ACA2D6

9790B6

837E95

6E6C73

5A5A52

Tritanopia

81DEE1

77BBBD

6E999A

657677

5B5353

Achromatopsia

D1D1D1

B2B2B2

949494

767676

575757

Shades & Tints Shades & Tints

#7AFFC5

Dark

Light

#72D5A8

Dark

Light

#6BAB8B

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7affc5;
  --color-2: #72d5a8;
  --color-3: #6bab8b;
  --color-4: #63816d;
  --color-5: #5b5750;
}

SCSS

$color-1: #7affc5;
$color-2: #72d5a8;
$color-3: #6bab8b;
$color-4: #63816d;
$color-5: #5b5750;

TAILWIND

colors: {
  'brand-1': '#7affc5',
  'brand-2': '#72d5a8',
  'brand-3': '#6bab8b',
  'brand-4': '#63816d',
  'brand-5': '#5b5750',
}

RGB Array

[122, 255, 197], [114, 213, 168], [107, 171, 139], [99, 129, 109], [91, 87, 80]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #7AFFC5, #72D5A8, #6BAB8B, #63816D, #5B5750 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: #7affc5; --color-2: #72d5a8; --color-3: #6bab8b; --color-4: #63816d; --color-5: #5b5750. 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 space-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