← Back to Editor

#67917A · #170409 · #B8AF03 · #CCBF82 · #E33258

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

#67917A

Celadon · SlateGray · Olive Green

HEX
#67917A
RGB
rgb(103, 145, 122)
HSL
hsl(147, 17%, 49%)
HSB
hsb(147, 29%, 57%)
CMYK
cmyk(29%, 0%, 16%, 43%)
Oklch
oklch(61.9% 0.058 160.1)

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

#170409

Dark Violet · Black · Raspberry

HEX
#170409
RGB
rgb(23, 4, 9)
HSL
hsl(344, 70%, 5%)
HSB
hsb(344, 83%, 9%)
CMYK
cmyk(0%, 83%, 61%, 91%)
Oklch
oklch(14.7% 0.038 3.1)

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

#B8AF03

Autumn Sage · DarkGoldenRod · Honey Gold

HEX
#B8AF03
RGB
rgb(184, 175, 3)
HSL
hsl(57, 97%, 37%)
HSB
hsb(57, 98%, 72%)
CMYK
cmyk(0%, 5%, 98%, 28%)
Oklch
oklch(73.8% 0.157 105.9)

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

#CCBF82

Ginger · Tan · Sunflower

HEX
#CCBF82
RGB
rgb(204, 191, 130)
HSL
hsl(49, 42%, 65%)
HSB
hsb(49, 36%, 80%)
CMYK
cmyk(0%, 6%, 36%, 20%)
Oklch
oklch(80.1% 0.081 97.6)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#E33258

Vermilion · Crimson · Passion Red

HEX
#E33258
RGB
rgb(227, 50, 88)
HSL
hsl(347, 76%, 54%)
HSB
hsb(347, 78%, 89%)
CMYK
cmyk(0%, 78%, 61%, 11%)
Oklch
oklch(60.5% 0.211 14.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

67917A
92687F

Analogous

6A9268
67917A
689290

Triadic

67917A
7B6892
927B68

Split-Comp.

67917A
906892
92686A

Tetradic

67917A
686A92
92687F
929068

Contrast Matrix WCAG 2.1 Contrast

67917A
170409
B8AF03
CCBF82
E33258
—
5.6
AA
1.6
Fail
1.9
Fail
1.2
Fail
5.6
AA
—
8.7
AAA
10.7
AAA
4.6
AA
1.6
Fail
8.7
AAA
—
1.2
Fail
1.9
Fail
1.9
Fail
10.7
AAA
1.2
Fail
—
2.3
Fail
1.2
Fail
4.6
AA
1.9
Fail
2.3
Fail
—
White BG
3.6AA Large
19.9AAA
2.3Fail
1.9Fail
4.3AA Large
Black BG
5.9AA
1.1Fail
9.2AAA
11.3AAA
4.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

797A80
0F0F08
B4B42D
C6C691
96954F

Deuteranopia

777481
101108
B5B537
C7C894
A1AE4D

Tritanopia

698485
160707
B84D55
CB9C9F
DA4846

Achromatopsia

828282
0A0A0A
9E9E9E
BCBCBC
6B6B6B

Shades & Tints Shades & Tints

#67917A

Dark
Light

#170409

Dark
Light

#B8AF03

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #67917a;
  --color-2: #170409;
  --color-3: #b8af03;
  --color-4: #ccbf82;
  --color-5: #e33258;
}

SCSS

$color-1: #67917a;
$color-2: #170409;
$color-3: #b8af03;
$color-4: #ccbf82;
$color-5: #e33258;

TAILWIND

colors: {
  'brand-1': '#67917a',
  'brand-2': '#170409',
  'brand-3': '#b8af03',
  'brand-4': '#ccbf82',
  'brand-5': '#e33258',
}

RGB Array

[103, 145, 122], [23, 4, 9], [184, 175, 3], [204, 191, 130], [227, 50, 88]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #67917A, #170409, #B8AF03, #CCBF82, #E33258 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: #67917a; --color-2: #170409; --color-3: #b8af03; --color-4: #ccbf82; --color-5: #e33258. 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