#7BB59C + #75A3B0 + #6EB0FC + #BFF1D6 + #76CEC2 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#7BB59C

Mineral Blue · DarkSeaGreen · Olive Green

HEX

#7BB59C

RGB

rgb(123, 181, 156)

HSL

hsl(154, 28%, 60%)

HSB

hsb(154, 32%, 71%)

CMYK

cmyk(32%, 0%, 14%, 29%)

Oklch

oklch(72.6% 0.071 165.7)

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

#75A3B0

Slate Blue · CadetBlue · Lake Green

HEX

#75A3B0

RGB

rgb(117, 163, 176)

HSL

hsl(193, 27%, 57%)

HSB

hsb(193, 34%, 69%)

CMYK

cmyk(34%, 7%, 0%, 31%)

Oklch

oklch(68.7% 0.053 217.2)

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

#6EB0FC

Azure · CornflowerBlue · Cobalt Blue

HEX

#6EB0FC

RGB

rgb(110, 176, 252)

HSL

hsl(212, 96%, 71%)

HSB

hsb(212, 56%, 99%)

CMYK

cmyk(56%, 30%, 0%, 1%)

Oklch

oklch(74.5% 0.130 253.0)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#BFF1D6

Emerald · LightBlue · Mint Green

HEX

#BFF1D6

RGB

rgb(191, 241, 214)

HSL

hsl(148, 64%, 85%)

HSB

hsb(148, 21%, 95%)

CMYK

cmyk(21%, 0%, 11%, 5%)

Oklch

oklch(91.6% 0.063 161.3)

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

#76CEC2

Jade · MediumAquaMarine · Lake Green

HEX

#76CEC2

RGB

rgb(118, 206, 194)

HSL

hsl(172, 47%, 64%)

HSB

hsb(172, 43%, 81%)

CMYK

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

Oklch

oklch(79.3% 0.087 184.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7BB59C

B67C95

Analogous

7CB680

7BB59C

7CB2B6

Triadic

7BB59C

9D7CB6

B69D7C

Split-Comp.

7BB59C

B67CB2

B6807C

Tetradic

7BB59C

807CB6

B67C95

B2B67C

Contrast Matrix WCAG 2.1 Contrast

7BB59C	75A3B0	6EB0FC	BFF1D6	76CEC2
—	1.2 Fail	1.0 Fail	1.9 Fail	1.3 Fail
1.2 Fail	—	1.2 Fail	2.2 Fail	1.5 Fail
1.0 Fail	1.2 Fail	—	1.8 Fail	1.2 Fail
1.9 Fail	2.2 Fail	1.8 Fail	—	1.5 Fail
1.3 Fail	1.5 Fail	1.2 Fail	1.5 Fail	—

White BG

2.4Fail

2.8Fail

2.3Fail

1.3Fail

1.8Fail

Black BG

8.9AAA

7.6AAA

9.3AAA

16.8AAA

11.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9495A2

8989AD

8B8BEA

D5D5DD

9C9DC5

Deuteranopia

918CA4

8683AC

8782E5

D2CEDE

9790C6

Tritanopia

7EA7A8

77AAAA

71DBD8

C2E2E3

7AC7C8

Achromatopsia

A1A1A1

979797

A5A5A5

DFDFDF

B2B2B2

Shades & Tints Shades & Tints

#7BB59C

Dark

Light

#75A3B0

Dark

Light

#6EB0FC

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7bb59c;
  --color-2: #75a3b0;
  --color-3: #6eb0fc;
  --color-4: #bff1d6;
  --color-5: #76cec2;
}

SCSS

$color-1: #7bb59c;
$color-2: #75a3b0;
$color-3: #6eb0fc;
$color-4: #bff1d6;
$color-5: #76cec2;

TAILWIND

colors: {
  'brand-1': '#7bb59c',
  'brand-2': '#75a3b0',
  'brand-3': '#6eb0fc',
  'brand-4': '#bff1d6',
  'brand-5': '#76cec2',
}

RGB Array

[123, 181, 156], [117, 163, 176], [110, 176, 252], [191, 241, 214], [118, 206, 194]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7BB59C, #75A3B0, #6EB0FC, #BFF1D6, #76CEC2 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: #7bb59c; --color-2: #75a3b0; --color-3: #6eb0fc; --color-4: #bff1d6; --color-5: #76cec2. 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