← Back to Editor

#4C303C · #C7667A · #96CAA3 · #E8E16F · #E87D39

pastel

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarm

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustrationData Visualization

Color Details Color Details

#4C303C

Dark Violet · DarkSlateGray · Raspberry

HEX
#4C303C
RGB
rgb(76, 48, 60)
HSL
hsl(334, 23%, 24%)
HSB
hsb(334, 37%, 30%)
CMYK
cmyk(0%, 37%, 21%, 70%)
Oklch
oklch(34.7% 0.045 352.3)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

#C7667A

Crimson · LightCoral · Passion Red

HEX
#C7667A
RGB
rgb(199, 102, 122)
HSL
hsl(348, 46%, 59%)
HSB
hsb(348, 49%, 78%)
CMYK
cmyk(0%, 49%, 39%, 22%)
Oklch
oklch(62.9% 0.125 8.3)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#96CAA3

Celadon · DarkSeaGreen · Apple Green

HEX
#96CAA3
RGB
rgb(150, 202, 163)
HSL
hsl(135, 33%, 69%)
HSB
hsb(135, 26%, 79%)
CMYK
cmyk(26%, 0%, 19%, 21%)
Oklch
oklch(79.2% 0.077 152.1)

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

#E8E16F

Fresh Green · Khaki · Sunflower

HEX
#E8E16F
RGB
rgb(232, 225, 111)
HSL
hsl(57, 72%, 67%)
HSB
hsb(57, 52%, 91%)
CMYK
cmyk(0%, 3%, 52%, 9%)
Oklch
oklch(89.3% 0.136 105.7)

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

#E87D39

Tangerine · Coral · Warm Sun

HEX
#E87D39
RGB
rgb(232, 125, 57)
HSL
hsl(23, 79%, 57%)
HSB
hsb(23, 75%, 91%)
CMYK
cmyk(0%, 46%, 75%, 9%)
Oklch
oklch(69.8% 0.154 49.9)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4C303C
2F4B3F

Analogous

4B2F49
4C303C
4B312F

Triadic

4C303C
3B4B2F
2F3B4B

Split-Comp.

4C303C
2F4B31
2F494B

Tetradic

4C303C
494B2F
2F4B3F
312F4B

Contrast Matrix WCAG 2.1 Contrast

4C303C
C7667A
96CAA3
E8E16F
E87D39
—
3.1
AA Large
6.3
AA
8.6
AAA
4.1
AA Large
3.1
AA Large
—
2.0
Fail
2.8
Fail
1.3
Fail
6.3
AA
2.0
Fail
—
1.4
Fail
1.5
Fail
8.6
AAA
2.8
Fail
1.4
Fail
—
2.1
Fail
4.1
AA Large
1.3
Fail
1.5
Fail
2.1
Fail
—
White BG
11.7AAA
3.7AA Large
1.9Fail
1.4Fail
2.8Fail
Black BG
1.8Fail
5.6AA
11.3AAA
15.4AAA
7.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

404039
9D9C75
ADADAC
E5E58B
BAB949

Deuteranopia

424438
A3AA74
AAA6AF
E5E691
C0C84D

Tritanopia

4B3736
C27171
99B4B6
E8A0A5
E35659

Achromatopsia

3A3A3A
858585
B6B6B6
D6D6D6
959595

Shades & Tints Shades & Tints

#4C303C

Dark
Light

#C7667A

Dark
Light

#96CAA3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4c303c;
  --color-2: #c7667a;
  --color-3: #96caa3;
  --color-4: #e8e16f;
  --color-5: #e87d39;
}

SCSS

$color-1: #4c303c;
$color-2: #c7667a;
$color-3: #96caa3;
$color-4: #e8e16f;
$color-5: #e87d39;

TAILWIND

colors: {
  'brand-1': '#4c303c',
  'brand-2': '#c7667a',
  'brand-3': '#96caa3',
  'brand-4': '#e8e16f',
  'brand-5': '#e87d39',
}

RGB Array

[76, 48, 60], [199, 102, 122], [150, 202, 163], [232, 225, 111], [232, 125, 57]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #4C303C, #C7667A, #96CAA3, #E8E16F, #E87D39 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #4c303c; --color-2: #c7667a; --color-3: #96caa3; --color-4: #e8e16f; --color-5: #e87d39. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 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