← Back to Editor

#3E0321 · #FFFDD1 · #0F9CAA · #A8B316 · #586533

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

#3E0321

Rose Purple · Black · Raspberry

HEX
#3E0321
RGB
rgb(62, 3, 33)
HSL
hsl(329, 91%, 13%)
HSB
hsb(329, 95%, 24%)
CMYK
cmyk(0%, 95%, 47%, 76%)
Oklch
oklch(24.1% 0.093 355.9)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

#FFFDD1

Fresh Green · LightYellow · Lemon Cream

HEX
#FFFDD1
RGB
rgb(255, 253, 209)
HSL
hsl(57, 100%, 91%)
HSB
hsb(57, 18%, 100%)
CMYK
cmyk(0%, 1%, 18%, 0%)
Oklch
oklch(98.5% 0.057 105.2)

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

#0F9CAA

Lake Blue · LightSeaGreen · Mint Ice

HEX
#0F9CAA
RGB
rgb(15, 156, 170)
HSL
hsl(185, 84%, 36%)
HSB
hsb(185, 91%, 67%)
CMYK
cmyk(91%, 8%, 0%, 33%)
Oklch
oklch(63.4% 0.106 206.3)

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

#A8B316

Autumn Sage · DarkGoldenRod · Honey Gold

HEX
#A8B316
RGB
rgb(168, 179, 22)
HSL
hsl(64, 78%, 39%)
HSB
hsb(64, 88%, 70%)
CMYK
cmyk(6%, 0%, 88%, 30%)
Oklch
oklch(73.3% 0.160 114.2)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#586533

Grass Green · DarkOliveGreen · Forest Green

HEX
#586533
RGB
rgb(88, 101, 51)
HSL
hsl(76, 33%, 30%)
HSB
hsb(76, 50%, 40%)
CMYK
cmyk(13%, 0%, 50%, 60%)
Oklch
oklch(48.3% 0.074 121.2)

Traditional「Grass Green」· Paint「Forest Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3E0321
033F20

Analogous

3E033F
3E0321
3F0304

Triadic

3E0321
223F03
03223F

Split-Comp.

3E0321
043F03
033F3E

Tetradic

3E0321
3F3E03
033F20
03043F

Contrast Matrix WCAG 2.1 Contrast

3E0321
FFFDD1
0F9CAA
A8B316
586533
—
16.3
AAA
5.1
AA
7.4
AAA
2.7
Fail
16.3
AAA
—
3.2
AA Large
2.2
Fail
6.1
AA
5.1
AA
3.2
AA Large
—
1.4
Fail
1.9
Fail
7.4
AAA
2.2
Fail
1.4
Fail
—
2.7
Fail
2.7
Fail
6.1
AA
1.9
Fail
2.7
Fail
—
White BG
16.9AAA
1.0Fail
3.3AA Large
2.3Fail
6.3AA
Black BG
1.2Fail
20.2AAA
6.4AA
9.1AAA
3.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

24241A
FEFEDC
4C4DA7
ADAD3C
5E5E3F

Deuteranopia

282C18
FEFEDE
4439A6
ACAB45
5D5C42

Tritanopia

3B1413
FFE4E6
16A4A3
A95A61
59494B

Achromatopsia

181818
F9F9F9
737373
9E9E9E
5B5B5B

Shades & Tints Shades & Tints

#3E0321

Dark
Light

#FFFDD1

Dark
Light

#0F9CAA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3e0321;
  --color-2: #fffdd1;
  --color-3: #0f9caa;
  --color-4: #a8b316;
  --color-5: #586533;
}

SCSS

$color-1: #3e0321;
$color-2: #fffdd1;
$color-3: #0f9caa;
$color-4: #a8b316;
$color-5: #586533;

TAILWIND

colors: {
  'brand-1': '#3e0321',
  'brand-2': '#fffdd1',
  'brand-3': '#0f9caa',
  'brand-4': '#a8b316',
  'brand-5': '#586533',
}

RGB Array

[62, 3, 33], [255, 253, 209], [15, 156, 170], [168, 179, 22], [88, 101, 51]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #3E0321, #FFFDD1, #0F9CAA, #A8B316, #586533 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #3e0321; --color-2: #fffdd1; --color-3: #0f9caa; --color-4: #a8b316; --color-5: #586533. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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