← Back to Editor

#586160 · #8B9C8A · #AEB39D · #F1F1E7 · #CDC3A8

pastel

A 5-color pastel palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarmCool

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustrationData Visualization

Color Details Color Details

#586160

Ink Gray · DimGray · Charcoal

HEX
#586160
RGB
rgb(88, 97, 96)
HSL
hsl(173, 5%, 36%)
HSB
hsb(173, 9%, 38%)
CMYK
cmyk(9%, 0%, 1%, 62%)
Oklch
oklch(48.4% 0.011 188.7)

TraditionalInk Gray」· PaintCharcoal」· Creative Midnight Shadow

#8B9C8A

Celadon · Gray · Silver Sand

HEX
#8B9C8A
RGB
rgb(139, 156, 138)
HSL
hsl(117, 8%, 58%)
HSB
hsb(117, 12%, 61%)
CMYK
cmyk(11%, 0%, 12%, 39%)
Oklch
oklch(67.4% 0.032 143.7)

TraditionalCeladon」· PaintSilver Sand」· Creative Urban Concrete

#AEB39D

Willow Green · DarkGray · Apple Green

HEX
#AEB39D
RGB
rgb(174, 179, 157)
HSL
hsl(74, 13%, 66%)
HSB
hsb(74, 12%, 70%)
CMYK
cmyk(3%, 0%, 12%, 30%)
Oklch
oklch(75.7% 0.031 117.6)

TraditionalWillow Green」· PaintApple Green」· Creative Mint Breeze

#F1F1E7

Fresh Green · Linen · Lemon Cream

HEX
#F1F1E7
RGB
rgb(241, 241, 231)
HSL
hsl(60, 26%, 93%)
HSB
hsb(60, 4%, 95%)
CMYK
cmyk(0%, 0%, 4%, 5%)
Oklch
oklch(95.5% 0.013 106.6)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#CDC3A8

Goose Yellow · Silver · Sunflower

HEX
#CDC3A8
RGB
rgb(205, 195, 168)
HSL
hsl(44, 27%, 73%)
HSB
hsb(44, 18%, 80%)
CMYK
cmyk(0%, 5%, 18%, 20%)
Oklch
oklch(81.8% 0.038 90.1)

TraditionalGoose Yellow」· PaintSunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

586160
605758

Analogous

57605B
586160
575D60

Triadic

586160
5F5760
605F57

Split-Comp.

586160
60575D
605B57

Tetradic

586160
5B5760
605758
5D6057

Contrast Matrix WCAG 2.1 Contrast

586160
8B9C8A
AEB39D
F1F1E7
CDC3A8
2.2
Fail
3.0
Fail
5.6
AA
3.6
AA Large
2.2
Fail
1.3
Fail
2.6
Fail
1.7
Fail
3.0
Fail
1.3
Fail
1.9
Fail
1.2
Fail
5.6
AA
2.6
Fail
1.9
Fail
1.5
Fail
3.6
AA Large
1.7
Fail
1.2
Fail
1.5
Fail
White BG
6.4AA
2.9Fail
2.2Fail
1.1Fail
1.8Fail
Black BG
3.3AA Large
7.2AAA
9.7AAA
18.5AAA
12.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5C5C60
92938E
B0B0A2
F1F1E9
C9C9AF

Deuteranopia

5B5B60
91908F
B0B0A4
F1F1EA
C9CAB0

Tritanopia

586060
8C9293
AEA7A7
F1EBEC
CDB4B5

Achromatopsia

5E5E5E
959595
AFAFAF
F0F0F0
C3C3C3

Shades & Tints Shades & Tints

#586160

Dark
Light

#8B9C8A

Dark
Light

#AEB39D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #586160;
  --color-2: #8b9c8a;
  --color-3: #aeb39d;
  --color-4: #f1f1e7;
  --color-5: #cdc3a8;
}

SCSS

$color-1: #586160;
$color-2: #8b9c8a;
$color-3: #aeb39d;
$color-4: #f1f1e7;
$color-5: #cdc3a8;

TAILWIND

colors: {
  'brand-1': '#586160',
  'brand-2': '#8b9c8a',
  'brand-3': '#aeb39d',
  'brand-4': '#f1f1e7',
  'brand-5': '#cdc3a8',
}

RGB Array

[88, 97, 96], [139, 156, 138], [174, 179, 157], [241, 241, 231], [205, 195, 168]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #586160, #8B9C8A, #AEB39D, #F1F1E7, #CDC3A8 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #586160; --color-2: #8b9c8a; --color-3: #aeb39d; --color-4: #f1f1e7; --color-5: #cdc3a8. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 pastel-style 5-color scheme is especially suited for beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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