← Back to Editor

#F585A3 · #F7EAD9 · #DAF2E6 · #B7DCCB · #608180

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

#F585A3

Rouge · LightCoral · Rose Pink

HEX
#F585A3
RGB
rgb(245, 133, 163)
HSL
hsl(344, 85%, 74%)
HSB
hsb(344, 46%, 96%)
CMYK
cmyk(0%, 46%, 33%, 4%)
Oklch
oklch(74.7% 0.139 3.9)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#F7EAD9

Goose Yellow · Beige · Peach Orange

HEX
#F7EAD9
RGB
rgb(247, 234, 217)
HSL
hsl(34, 65%, 91%)
HSB
hsb(34, 12%, 97%)
CMYK
cmyk(0%, 5%, 12%, 3%)
Oklch
oklch(94.3% 0.027 74.8)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#DAF2E6

Jade · Lavender · Mint Green

HEX
#DAF2E6
RGB
rgb(218, 242, 230)
HSL
hsl(150, 48%, 90%)
HSB
hsb(150, 10%, 95%)
CMYK
cmyk(10%, 0%, 5%, 5%)
Oklch
oklch(94.0% 0.030 164.3)

Traditional「Jade」· Paint「Mint Green」· Creative Arctic Pool

#B7DCCB

Jade · LightBlue · Apple Green

HEX
#B7DCCB
RGB
rgb(183, 220, 203)
HSL
hsl(152, 35%, 79%)
HSB
hsb(152, 17%, 86%)
CMYK
cmyk(17%, 0%, 8%, 14%)
Oklch
oklch(86.3% 0.045 165.8)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#608180

Mineral Blue · SlateGray · Mint Ice

HEX
#608180
RGB
rgb(96, 129, 128)
HSL
hsl(178, 15%, 44%)
HSB
hsb(178, 26%, 51%)
CMYK
cmyk(26%, 0%, 1%, 49%)
Oklch
oklch(57.8% 0.037 193.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F585A3
84F5D7

Analogous

F584DB
F585A3
F59F84

Triadic

F585A3
A2F584
84A2F5

Split-Comp.

F585A3
84F59F
84DBF5

Tetradic

F585A3
DBF584
84F5D7
9F84F5

Contrast Matrix WCAG 2.1 Contrast

F585A3
F7EAD9
DAF2E6
B7DCCB
608180
—
2.0
Fail
2.0
Fail
1.6
Fail
1.8
Fail
2.0
Fail
—
1.0
Fail
1.3
Fail
3.6
AA Large
2.0
Fail
1.0
Fail
—
1.3
Fail
3.6
AA Large
1.6
Fail
1.3
Fail
1.3
Fail
—
2.9
Fail
1.8
Fail
3.6
AA Large
3.6
AA Large
2.9
Fail
—
White BG
2.4Fail
1.2Fail
1.2Fail
1.5Fail
4.2AA Large
Black BG
8.8AAA
17.7AAA
17.8AAA
14.1AAA
4.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C5C39C
F1F1DD
E4E5E9
C7C7CF
6E6F80

Deuteranopia

CBD39A
F2F3DE
E3E1EA
C5C2D0
6C6A80

Tritanopia

EF9695
F6E0E1
DBEBEC
B9D2D3
628080

Achromatopsia

AAAAAA
ECECEC
E9E9E9
CFCFCF
777777

Shades & Tints Shades & Tints

#F585A3

Dark
Light

#F7EAD9

Dark
Light

#DAF2E6

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f585a3;
  --color-2: #f7ead9;
  --color-3: #daf2e6;
  --color-4: #b7dccb;
  --color-5: #608180;
}

SCSS

$color-1: #f585a3;
$color-2: #f7ead9;
$color-3: #daf2e6;
$color-4: #b7dccb;
$color-5: #608180;

TAILWIND

colors: {
  'brand-1': '#f585a3',
  'brand-2': '#f7ead9',
  'brand-3': '#daf2e6',
  'brand-4': '#b7dccb',
  'brand-5': '#608180',
}

RGB Array

[245, 133, 163], [247, 234, 217], [218, 242, 230], [183, 220, 203], [96, 129, 128]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #F585A3, #F7EAD9, #DAF2E6, #B7DCCB, #608180 is ideal for: health products, baby brands, fresh-style blogs, 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: #f585a3; --color-2: #f7ead9; --color-3: #daf2e6; --color-4: #b7dccb; --color-5: #608180. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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