#77A78F + #79AE92 + #91AE90 + #FFB8A2 + #EE8782 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#77A78F

Mineral Blue · CadetBlue · Olive Green

HEX

#77A78F

RGB

rgb(119, 167, 143)

HSL

hsl(150, 21%, 56%)

HSB

hsb(150, 29%, 65%)

CMYK

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

Oklch

oklch(68.7% 0.063 162.5)

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

#79AE92

Celadon · DarkSeaGreen · Olive Green

HEX

#79AE92

RGB

rgb(121, 174, 146)

HSL

hsl(148, 25%, 58%)

HSB

hsb(148, 30%, 68%)

CMYK

cmyk(30%, 0%, 16%, 32%)

Oklch

oklch(70.6% 0.070 160.9)

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

#91AE90

Celadon · DarkSeaGreen · Apple Green

HEX

#91AE90

RGB

rgb(145, 174, 144)

HSL

hsl(118, 16%, 62%)

HSB

hsb(118, 17%, 68%)

CMYK

cmyk(17%, 0%, 17%, 32%)

Oklch

oklch(72.1% 0.053 144.1)

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

#FFB8A2

Peach Pink · LightPink · Cherry Blossom

HEX

#FFB8A2

RGB

rgb(255, 184, 162)

HSL

hsl(14, 100%, 82%)

HSB

hsb(14, 36%, 100%)

CMYK

cmyk(0%, 28%, 36%, 0%)

Oklch

oklch(84.3% 0.088 37.9)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#EE8782

Peach Pink · LightCoral · Coral Red

HEX

#EE8782

RGB

rgb(238, 135, 130)

HSL

hsl(3, 76%, 72%)

HSB

hsb(3, 45%, 93%)

CMYK

cmyk(0%, 43%, 45%, 7%)

Oklch

oklch(73.3% 0.127 23.6)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

77A78F

A6778F

Analogous

77A677

77A78F

77A6A6

Triadic

77A78F

8F77A6

A68F77

Split-Comp.

77A78F

A677A6

A67777

Tetradic

77A78F

7777A6

A6778F

A6A677

Contrast Matrix WCAG 2.1 Contrast

77A78F	79AE92	91AE90	FFB8A2	EE8782
—	1.1 Fail	1.1 Fail	1.6 Fail	1.1 Fail
1.1 Fail	—	1.0 Fail	1.5 Fail	1.0 Fail
1.1 Fail	1.0 Fail	—	1.5 Fail	1.0 Fail
1.6 Fail	1.5 Fail	1.5 Fail	—	1.5 Fail
1.1 Fail	1.0 Fail	1.0 Fail	1.5 Fail	—

White BG

2.7Fail

2.5Fail

2.4Fail

1.7Fail

2.5Fail

Black BG

7.7AAA

8.3AAA

8.7AAA

12.6AAA

8.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8C8C95

909099

9E9E97

E0E0A7

C1C083

Deuteranopia

898596

8D899A

9C9A99

E4EAA9

C7CF84

Tritanopia

79999A

7C9E9F

929D9E

FBACAC

E98484

Achromatopsia

969696

9B9B9B

A2A2A2

CBCBCB

A5A5A5

Shades & Tints Shades & Tints

#77A78F

Dark

Light

#79AE92

Dark

Light

#91AE90

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #77a78f;
  --color-2: #79ae92;
  --color-3: #91ae90;
  --color-4: #ffb8a2;
  --color-5: #ee8782;
}

SCSS

$color-1: #77a78f;
$color-2: #79ae92;
$color-3: #91ae90;
$color-4: #ffb8a2;
$color-5: #ee8782;

TAILWIND

colors: {
  'brand-1': '#77a78f',
  'brand-2': '#79ae92',
  'brand-3': '#91ae90',
  'brand-4': '#ffb8a2',
  'brand-5': '#ee8782',
}

RGB Array

[119, 167, 143], [121, 174, 146], [145, 174, 144], [255, 184, 162], [238, 135, 130]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #77A78F, #79AE92, #91AE90, #FFB8A2, #EE8782 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: #77a78f; --color-2: #79ae92; --color-3: #91ae90; --color-4: #ffb8a2; --color-5: #ee8782. 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