← Back to Editor

#F74848 · #AA434A · #554351 · #1C4957 · #3B2F2F

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

#F74848

Peach Pink · Tomato · Coral Red

HEX
#F74848
RGB
rgb(247, 72, 72)
HSL
hsl(0, 92%, 63%)
HSB
hsb(0, 71%, 97%)
CMYK
cmyk(0%, 71%, 71%, 3%)
Oklch
oklch(65.4% 0.212 25.2)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#AA434A

Crimson · Sienna · Passion Red

HEX
#AA434A
RGB
rgb(170, 67, 74)
HSL
hsl(356, 43%, 46%)
HSB
hsb(356, 61%, 67%)
CMYK
cmyk(0%, 61%, 56%, 33%)
Oklch
oklch(52.4% 0.135 19.0)

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

#554351

Rose Purple · DarkSlateGray · Eggplant

HEX
#554351
RGB
rgb(85, 67, 81)
HSL
hsl(313, 12%, 30%)
HSB
hsb(313, 21%, 33%)
CMYK
cmyk(0%, 21%, 5%, 67%)
Oklch
oklch(40.7% 0.033 334.0)

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

#1C4957

Lake Blue · DarkSlateGray · Peacock Green

HEX
#1C4957
RGB
rgb(28, 73, 87)
HSL
hsl(194, 51%, 23%)
HSB
hsb(194, 68%, 34%)
CMYK
cmyk(68%, 16%, 0%, 66%)
Oklch
oklch(38.1% 0.054 221.5)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#3B2F2F

Crimson · DarkSlateGray · Wine Red

HEX
#3B2F2F
RGB
rgb(59, 47, 47)
HSL
hsl(0, 11%, 21%)
HSB
hsb(0, 20%, 23%)
CMYK
cmyk(0%, 20%, 20%, 77%)
Oklch
oklch(31.8% 0.018 18.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F74848
4AF7F7

Analogous

F74AA1
F74848
F7A14A

Triadic

F74848
4AF74A
4A4AF7

Split-Comp.

F74848
4AF7A1
4AA1F7

Tetradic

F74848
A1F74A
4AF7F7
A14AF7

Contrast Matrix WCAG 2.1 Contrast

F74848
AA434A
554351
1C4957
3B2F2F
—
1.7
Fail
2.6
Fail
2.8
Fail
3.7
AA Large
1.7
Fail
—
1.6
Fail
1.7
Fail
2.2
Fail
2.6
Fail
1.6
Fail
—
1.1
Fail
1.4
Fail
2.8
Fail
1.7
Fail
1.1
Fail
—
1.3
Fail
3.7
AA Large
2.2
Fail
1.4
Fail
1.3
Fail
—
White BG
3.5AA Large
5.8AA
9.1AAA
9.8AAA
12.9AAA
Black BG
6.0AA
3.6AA Large
2.3Fail
2.1Fail
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

ABAA48
7D7C48
4D4D4E
2F3054
36362F

Deuteranopia

B5C248
838B48
4E504D
2D2A53
37372F

Tritanopia

EE4848
A54747
544B4A
1E5150
3A2F2F

Achromatopsia

7C7C7C
636363
4A4A4A
3D3D3D
333333

Shades & Tints Shades & Tints

#F74848

Dark
Light

#AA434A

Dark
Light

#554351

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f74848;
  --color-2: #aa434a;
  --color-3: #554351;
  --color-4: #1c4957;
  --color-5: #3b2f2f;
}

SCSS

$color-1: #f74848;
$color-2: #aa434a;
$color-3: #554351;
$color-4: #1c4957;
$color-5: #3b2f2f;

TAILWIND

colors: {
  'brand-1': '#f74848',
  'brand-2': '#aa434a',
  'brand-3': '#554351',
  'brand-4': '#1c4957',
  'brand-5': '#3b2f2f',
}

RGB Array

[247, 72, 72], [170, 67, 74], [85, 67, 81], [28, 73, 87], [59, 47, 47]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #F74848, #AA434A, #554351, #1C4957, #3B2F2F is ideal for: tech websites, dark mode UIs, game UIs, 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: #f74848; --color-2: #aa434a; --color-3: #554351; --color-4: #1c4957; --color-5: #3b2f2f. 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. 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