#74AF85 + #93B78E + #ECDFB6 + #F1A18E + #FE6962 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#74AF85

Celadon · DarkSeaGreen · Olive Green

HEX

#74AF85

RGB

rgb(116, 175, 133)

HSL

hsl(137, 27%, 57%)

HSB

hsb(137, 34%, 69%)

CMYK

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

Oklch

oklch(70.2% 0.087 152.8)

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

#93B78E

Celadon · DarkSeaGreen · Apple Green

HEX

#93B78E

RGB

rgb(147, 183, 142)

HSL

hsl(113, 22%, 64%)

HSB

hsb(113, 22%, 72%)

CMYK

cmyk(20%, 0%, 22%, 28%)

Oklch

oklch(74.2% 0.070 141.6)

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

#ECDFB6

Goose Yellow · Wheat · Lemon Cream

HEX

#ECDFB6

RGB

rgb(236, 223, 182)

HSL

hsl(46, 59%, 82%)

HSB

hsb(46, 23%, 93%)

CMYK

cmyk(0%, 6%, 23%, 7%)

Oklch

oklch(90.4% 0.056 92.5)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#F1A18E

Peach Pink · DarkSalmon · Coral Red

HEX

#F1A18E

RGB

rgb(241, 161, 142)

HSL

hsl(12, 78%, 75%)

HSB

hsb(12, 41%, 95%)

CMYK

cmyk(0%, 33%, 41%, 5%)

Oklch

oklch(78.3% 0.100 34.0)

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

#FE6962

Peach Pink · Tomato · Coral Red

HEX

#FE6962

RGB

rgb(254, 105, 98)

HSL

hsl(3, 99%, 69%)

HSB

hsb(3, 61%, 100%)

CMYK

cmyk(0%, 59%, 61%, 0%)

Oklch

oklch(70.6% 0.183 25.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

74AF85

AF749E

Analogous

81AF74

74AF85

74AFA2

Triadic

74AF85

8574AF

AF8574

Split-Comp.

74AF85

A274AF

AF7481

Tetradic

74AF85

7481AF

AF749E

AFA274

Contrast Matrix WCAG 2.1 Contrast

74AF85	93B78E	ECDFB6	F1A18E	FE6962
—	1.1 Fail	1.9 Fail	1.2 Fail	1.1 Fail
1.1 Fail	—	1.7 Fail	1.1 Fail	1.3 Fail
1.9 Fail	1.7 Fail	—	1.5 Fail	2.1 Fail
1.2 Fail	1.1 Fail	1.5 Fail	—	1.4 Fail
1.1 Fail	1.3 Fail	2.1 Fail	1.4 Fail	—

White BG

2.6Fail

2.2Fail

1.3Fail

2.1Fail

2.8Fail

Black BG

8.2AAA

9.4AAA

15.8AAA

10.2AAA

7.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8E8E8F

A3A398

E6E6C0

CECE93

BDBC64

Deuteranopia

8A8692

A19E9A

E7E8C2

D3D994

C6D164

Tritanopia

779799

95A0A1

EBC8C9

ED9697

F76565

Achromatopsia

999999

A8A8A8

DEDEDE

B7B7B7

959595

Shades & Tints Shades & Tints

#74AF85

Dark

Light

#93B78E

Dark

Light

#ECDFB6

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #74af85;
  --color-2: #93b78e;
  --color-3: #ecdfb6;
  --color-4: #f1a18e;
  --color-5: #fe6962;
}

SCSS

$color-1: #74af85;
$color-2: #93b78e;
$color-3: #ecdfb6;
$color-4: #f1a18e;
$color-5: #fe6962;

TAILWIND

colors: {
  'brand-1': '#74af85',
  'brand-2': '#93b78e',
  'brand-3': '#ecdfb6',
  'brand-4': '#f1a18e',
  'brand-5': '#fe6962',
}

RGB Array

[116, 175, 133], [147, 183, 142], [236, 223, 182], [241, 161, 142], [254, 105, 98]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #74AF85, #93B78E, #ECDFB6, #F1A18E, #FE6962 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: #74af85; --color-2: #93b78e; --color-3: #ecdfb6; --color-4: #f1a18e; --color-5: #fe6962. 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