#869898 + #AED68A + #FFF28E + #FE6F5E + #999888 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#869898

Slate Blue · LightSlateGray · Silver Sand

HEX

#869898

RGB

rgb(134, 152, 152)

HSL

hsl(180, 8%, 56%)

HSB

hsb(180, 12%, 60%)

CMYK

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

Oklch

oklch(66.5% 0.021 196.7)

Traditional「Slate Blue」· Paint「Silver Sand」· Creative Urban Concrete

#AED68A

Celadon · LightGreen · Apple Green

HEX

#AED68A

RGB

rgb(174, 214, 138)

HSL

hsl(92, 48%, 69%)

HSB

hsb(92, 36%, 84%)

CMYK

cmyk(19%, 0%, 36%, 16%)

Oklch

oklch(82.9% 0.110 131.0)

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

#FFF28E

Fresh Green · Khaki · Lemon Cream

HEX

#FFF28E

RGB

rgb(255, 242, 142)

HSL

hsl(53, 100%, 78%)

HSB

hsb(53, 44%, 100%)

CMYK

cmyk(0%, 5%, 44%, 0%)

Oklch

oklch(95.1% 0.122 101.9)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#FE6F5E

Peach Pink · Coral · Coral Red

HEX

#FE6F5E

RGB

rgb(254, 111, 94)

HSL

hsl(6, 99%, 68%)

HSB

hsb(6, 63%, 100%)

CMYK

cmyk(0%, 56%, 63%, 0%)

Oklch

oklch(71.3% 0.178 29.1)

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

#999888

Autumn Sage · Gray · Silver Sand

HEX

#999888

RGB

rgb(153, 152, 136)

HSL

hsl(56, 8%, 57%)

HSB

hsb(56, 11%, 60%)

CMYK

cmyk(0%, 1%, 11%, 40%)

Oklch

oklch(67.6% 0.023 104.1)

Traditional「Autumn Sage」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

869898

988686

Analogous

86988F

869898

868F98

Triadic

869898

988698

989886

Split-Comp.

869898

98868F

988F86

Tetradic

869898

8F8698

988686

8F9886

Contrast Matrix WCAG 2.1 Contrast

869898	AED68A	FFF28E	FE6F5E	999888
—	1.8 Fail	2.6 Fail	1.1 Fail	1.0 Fail
1.8 Fail	—	1.4 Fail	1.7 Fail	1.8 Fail
2.6 Fail	1.4 Fail	—	2.4 Fail	2.5 Fail
1.1 Fail	1.7 Fail	2.4 Fail	—	1.1 Fail
1.0 Fail	1.8 Fail	2.5 Fail	1.1 Fail	—

White BG

3.0AA Large

1.6Fail

1.1Fail

2.7Fail

2.9Fail

Black BG

7.0AA

12.8AAA

18.3AAA

7.6AAA

7.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8E8E98

BFC09C

F9F9A6

C0BF62

99998C

Deuteranopia

8D8B98

BDBAA1

FAFBAC

C8D363

99998D

Tritanopia

879898

B0ABAE

FEB9BE

F76566

998F90

Achromatopsia

939393

C1C1C1

EAEAEA

989898

969696

Shades & Tints Shades & Tints

#869898

Dark

Light

#AED68A

Dark

Light

#FFF28E

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #869898;
  --color-2: #aed68a;
  --color-3: #fff28e;
  --color-4: #fe6f5e;
  --color-5: #999888;
}

SCSS

$color-1: #869898;
$color-2: #aed68a;
$color-3: #fff28e;
$color-4: #fe6f5e;
$color-5: #999888;

TAILWIND

colors: {
  'brand-1': '#869898',
  'brand-2': '#aed68a',
  'brand-3': '#fff28e',
  'brand-4': '#fe6f5e',
  'brand-5': '#999888',
}

RGB Array

[134, 152, 152], [174, 214, 138], [255, 242, 142], [254, 111, 94], [153, 152, 136]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #869898, #AED68A, #FFF28E, #FE6F5E, #999888 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: #869898; --color-2: #aed68a; --color-3: #fff28e; --color-4: #fe6f5e; --color-5: #999888. 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