← Back to Editor

#3F3C51 · #2C635D · #447D6C · #4F9769 · #78A65E

pastel

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetCool

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#3F3C51

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#3F3C51
RGB
rgb(63, 60, 81)
HSL
hsl(249, 15%, 28%)
HSB
hsb(249, 26%, 32%)
CMYK
cmyk(22%, 26%, 0%, 68%)
Oklch
oklch(36.8% 0.036 291.1)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#2C635D

Mineral Blue · DarkSlateGray · Mint Ice

HEX
#2C635D
RGB
rgb(44, 99, 93)
HSL
hsl(173, 38%, 28%)
HSB
hsb(173, 56%, 39%)
CMYK
cmyk(56%, 0%, 6%, 61%)
Oklch
oklch(46.1% 0.059 185.9)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#447D6C

Mineral Blue · SeaGreen · Mint Ice

HEX
#447D6C
RGB
rgb(68, 125, 108)
HSL
hsl(162, 30%, 38%)
HSB
hsb(162, 46%, 49%)
CMYK
cmyk(46%, 0%, 14%, 51%)
Oklch
oklch(54.5% 0.066 172.4)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#4F9769

Celadon · MediumSeaGreen · Olive Green

HEX
#4F9769
RGB
rgb(79, 151, 105)
HSL
hsl(142, 31%, 45%)
HSB
hsb(142, 48%, 59%)
CMYK
cmyk(48%, 0%, 30%, 41%)
Oklch
oklch(61.7% 0.101 154.2)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#78A65E

Celadon · Gray · Olive Green

HEX
#78A65E
RGB
rgb(120, 166, 94)
HSL
hsl(98, 29%, 51%)
HSB
hsb(98, 43%, 65%)
CMYK
cmyk(28%, 0%, 43%, 35%)
Oklch
oklch(67.4% 0.112 135.0)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3F3C51
4F523D

Analogous

3D4452
3F3C51
4B3D52

Triadic

3F3C51
52403D
3D5240

Split-Comp.

3F3C51
524B3D
44523D

Tetradic

3F3C51
523D44
4F523D
3D524B

Contrast Matrix WCAG 2.1 Contrast

3F3C51
2C635D
447D6C
4F9769
78A65E
—
1.5
Fail
2.2
Fail
3.0
AA Large
3.8
AA Large
1.5
Fail
—
1.4
Fail
2.0
Fail
2.4
Fail
2.2
Fail
1.4
Fail
—
1.4
Fail
1.7
Fail
3.0
AA Large
2.0
Fail
1.4
Fail
—
1.2
Fail
3.8
AA Large
2.4
Fail
1.7
Fail
1.2
Fail
—
White BG
10.6AAA
6.9AA
4.8AA
3.5AA Large
2.8Fail
Black BG
2.0Fail
3.0AA Large
4.4AA Large
6.0AA
7.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3E3E4C
44445E
5D5D70
6E6F74
8C8C6F

Deuteranopia

3E3E4B
413D5F
595571
6A6577
898674

Tritanopia

3F4847
2F6060
477374
537D7F
7A7D80

Achromatopsia

3F3F3F
525252
6A6A6A
7C7C7C
909090

Shades & Tints Shades & Tints

#3F3C51

Dark
Light

#2C635D

Dark
Light

#447D6C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3f3c51;
  --color-2: #2c635d;
  --color-3: #447d6c;
  --color-4: #4f9769;
  --color-5: #78a65e;
}

SCSS

$color-1: #3f3c51;
$color-2: #2c635d;
$color-3: #447d6c;
$color-4: #4f9769;
$color-5: #78a65e;

TAILWIND

colors: {
  'brand-1': '#3f3c51',
  'brand-2': '#2c635d',
  'brand-3': '#447d6c',
  'brand-4': '#4f9769',
  'brand-5': '#78a65e',
}

RGB Array

[63, 60, 81], [44, 99, 93], [68, 125, 108], [79, 151, 105], [120, 166, 94]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #3F3C51, #2C635D, #447D6C, #4F9769, #78A65E is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs. Low-saturation colors convey a sophisticated, premium feel. 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: #3f3c51; --color-2: #2c635d; --color-3: #447d6c; --color-4: #4f9769; --color-5: #78a65e. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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 finance, legal, luxury 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