← Back to Editor

#9E4F4F · #C2826D · #D4BF96 · #BDDEBE · #ABEBE2

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

#9E4F4F

Crimson · Sienna · Passion Red

HEX
#9E4F4F
RGB
rgb(158, 79, 79)
HSL
hsl(0, 33%, 46%)
HSB
hsb(0, 50%, 62%)
CMYK
cmyk(0%, 50%, 50%, 38%)
Oklch
oklch(52.5% 0.105 21.3)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

#C2826D

Tangerine · DarkSalmon · Warm Sun

HEX
#C2826D
RGB
rgb(194, 130, 109)
HSL
hsl(15, 41%, 59%)
HSB
hsb(15, 44%, 76%)
CMYK
cmyk(0%, 33%, 44%, 24%)
Oklch
oklch(66.7% 0.086 38.9)

TraditionalTangerine」· PaintWarm Sun」· Creative Blush Sunrise

#D4BF96

Goose Yellow · Tan · Sunflower

HEX
#D4BF96
RGB
rgb(212, 191, 150)
HSL
hsl(40, 42%, 71%)
HSB
hsb(40, 29%, 83%)
CMYK
cmyk(0%, 10%, 29%, 17%)
Oklch
oklch(81.2% 0.060 83.9)

TraditionalGoose Yellow」· PaintSunflower」· Creative Lemon Fizz

#BDDEBE

Celadon · Silver · Mint Green

HEX
#BDDEBE
RGB
rgb(189, 222, 190)
HSL
hsl(122, 33%, 81%)
HSB
hsb(122, 15%, 87%)
CMYK
cmyk(15%, 0%, 14%, 13%)
Oklch
oklch(86.8% 0.056 145.9)

TraditionalCeladon」· PaintMint Green」· Creative Mint Breeze

#ABEBE2

Jade · LightBlue · Glacier Blue

HEX
#ABEBE2
RGB
rgb(171, 235, 226)
HSL
hsl(172, 62%, 80%)
HSB
hsb(172, 27%, 92%)
CMYK
cmyk(27%, 0%, 4%, 8%)
Oklch
oklch(89.5% 0.066 185.3)

TraditionalJade」· PaintGlacier Blue」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9E4F4F
4F9C9C

Analogous

9C4F75
9E4F4F
9C754F

Triadic

9E4F4F
4F9C4F
4F4F9C

Split-Comp.

9E4F4F
4F9C75
4F759C

Tetradic

9E4F4F
759C4F
4F9C9C
754F9C

Contrast Matrix WCAG 2.1 Contrast

9E4F4F
C2826D
D4BF96
BDDEBE
ABEBE2
1.8
Fail
3.2
AA Large
3.9
AA Large
4.3
AA Large
1.8
Fail
1.7
Fail
2.1
Fail
2.3
Fail
3.2
AA Large
1.7
Fail
1.2
Fail
1.3
Fail
3.9
AA Large
2.1
Fail
1.2
Fail
1.1
Fail
4.3
AA Large
2.3
Fail
1.3
Fail
1.1
Fail
White BG
5.7AA
3.1AA Large
1.8Fail
1.5Fail
1.3Fail
Black BG
3.7AA Large
6.7AA
11.7AAA
14.4AAA
15.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7C7B4F
A6A672
CBCBA0
CBCCC6
C7C7E4

Deuteranopia

80864F
AAAF73
CCCEA2
C9C7C8
C3BEE5

Tritanopia

9A4F4F
BF7677
D3A8A9
BFCCCD
AEE6E6

Achromatopsia

676767
939393
C1C1C1
D0D0D0
D7D7D7

Shades & Tints Shades & Tints

#9E4F4F

Dark
Light

#C2826D

Dark
Light

#D4BF96

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9e4f4f;
  --color-2: #c2826d;
  --color-3: #d4bf96;
  --color-4: #bddebe;
  --color-5: #abebe2;
}

SCSS

$color-1: #9e4f4f;
$color-2: #c2826d;
$color-3: #d4bf96;
$color-4: #bddebe;
$color-5: #abebe2;

TAILWIND

colors: {
  'brand-1': '#9e4f4f',
  'brand-2': '#c2826d',
  'brand-3': '#d4bf96',
  'brand-4': '#bddebe',
  'brand-5': '#abebe2',
}

RGB Array

[158, 79, 79], [194, 130, 109], [212, 191, 150], [189, 222, 190], [171, 235, 226]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #9E4F4F, #C2826D, #D4BF96, #BDDEBE, #ABEBE2 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: #9e4f4f; --color-2: #c2826d; --color-3: #d4bf96; --color-4: #bddebe; --color-5: #abebe2. 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