← Back to Editor

#9E7F83 · #D1AA9D · #FBCCB0 · #F7F2CC · #A4D0C4

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 PostIllustration

Color Details Color Details

#9E7F83

Crimson · Gray · Passion Red

HEX
#9E7F83
RGB
rgb(158, 127, 131)
HSL
hsl(352, 14%, 56%)
HSB
hsb(352, 20%, 62%)
CMYK
cmyk(0%, 20%, 17%, 38%)
Oklch
oklch(62.7% 0.039 9.5)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

#D1AA9D

Apricot · Tan · Warm Sun

HEX
#D1AA9D
RGB
rgb(209, 170, 157)
HSL
hsl(15, 36%, 72%)
HSB
hsb(15, 25%, 82%)
CMYK
cmyk(0%, 19%, 25%, 18%)
Oklch
oklch(76.9% 0.050 39.3)

TraditionalApricot」· PaintWarm Sun」· Creative Honey Glow

#FBCCB0

Apricot · Wheat · Peach Orange

HEX
#FBCCB0
RGB
rgb(251, 204, 176)
HSL
hsl(22, 90%, 84%)
HSB
hsb(22, 30%, 98%)
CMYK
cmyk(0%, 19%, 30%, 2%)
Oklch
oklch(87.9% 0.065 52.4)

TraditionalApricot」· PaintPeach Orange」· Creative Honey Glow

#F7F2CC

Fresh Green · Beige · Lemon Cream

HEX
#F7F2CC
RGB
rgb(247, 242, 204)
HSL
hsl(53, 73%, 88%)
HSB
hsb(53, 17%, 97%)
CMYK
cmyk(0%, 2%, 17%, 3%)
Oklch
oklch(95.5% 0.050 101.1)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#A4D0C4

Jade · LightSteelBlue · Lake Green

HEX
#A4D0C4
RGB
rgb(164, 208, 196)
HSL
hsl(164, 32%, 73%)
HSB
hsb(164, 21%, 82%)
CMYK
cmyk(21%, 0%, 6%, 18%)
Oklch
oklch(82.3% 0.049 176.5)

TraditionalJade」· PaintLake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9E7F83
7F9F9A

Analogous

9F7F93
9E7F83
9F8B7F

Triadic

9E7F83
839F7F
7F839F

Split-Comp.

9E7F83
7F9F8B
7F939F

Tetradic

9E7F83
939F7F
7F9F9A
8B7F9F

Contrast Matrix WCAG 2.1 Contrast

9E7F83
D1AA9D
FBCCB0
F7F2CC
A4D0C4
1.7
Fail
2.5
Fail
3.2
AA Large
2.1
Fail
1.7
Fail
1.4
Fail
1.9
Fail
1.2
Fail
2.5
Fail
1.4
Fail
1.3
Fail
1.2
Fail
3.2
AA Large
1.9
Fail
1.3
Fail
1.5
Fail
2.1
Fail
1.2
Fail
1.2
Fail
1.5
Fail
White BG
3.6AA Large
2.1Fail
1.5Fail
1.1Fail
1.7Fail
Black BG
5.8AA
9.9AAA
14.4AAA
18.5AAA
12.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

919082
C0C0A0
E7E6B7
F5F5D5
B7B7C7

Deuteranopia

929582
C2C5A1
E9EDB8
F5F5D7
B5B1C8

Tritanopia

9C8181
CFA3A3
F9BCBD
F7DCDE
A6C9CA

Achromatopsia

898989
B4B4B4
D7D7D7
EFEFEF
C1C1C1

Shades & Tints Shades & Tints

#9E7F83

Dark
Light

#D1AA9D

Dark
Light

#FBCCB0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9e7f83;
  --color-2: #d1aa9d;
  --color-3: #fbccb0;
  --color-4: #f7f2cc;
  --color-5: #a4d0c4;
}

SCSS

$color-1: #9e7f83;
$color-2: #d1aa9d;
$color-3: #fbccb0;
$color-4: #f7f2cc;
$color-5: #a4d0c4;

TAILWIND

colors: {
  'brand-1': '#9e7f83',
  'brand-2': '#d1aa9d',
  'brand-3': '#fbccb0',
  'brand-4': '#f7f2cc',
  'brand-5': '#a4d0c4',
}

RGB Array

[158, 127, 131], [209, 170, 157], [251, 204, 176], [247, 242, 204], [164, 208, 196]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #9E7F83, #D1AA9D, #FBCCB0, #F7F2CC, #A4D0C4 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: #9e7f83; --color-2: #d1aa9d; --color-3: #fbccb0; --color-4: #f7f2cc; --color-5: #a4d0c4. 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 pastel-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