← Back to Editor

#FF9600 · #AFD4CC · #F2EBD9 · #938C85 · #625C5E

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

#FF9600

Ochre · Orange · Amber Brown

HEX
#FF9600
RGB
rgb(255, 150, 0)
HSL
hsl(35, 100%, 50%)
HSB
hsb(35, 100%, 100%)
CMYK
cmyk(0%, 41%, 100%, 0%)
Oklch
oklch(76.7% 0.175 63.1)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#AFD4CC

Jade · LightSteelBlue · Glacier Blue

HEX
#AFD4CC
RGB
rgb(175, 212, 204)
HSL
hsl(167, 30%, 76%)
HSB
hsb(167, 17%, 83%)
CMYK
cmyk(17%, 0%, 4%, 17%)
Oklch
oklch(84.1% 0.041 180.7)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#F2EBD9

Goose Yellow · Beige · Lemon Cream

HEX
#F2EBD9
RGB
rgb(242, 235, 217)
HSL
hsl(43, 49%, 90%)
HSB
hsb(43, 10%, 95%)
CMYK
cmyk(0%, 3%, 10%, 5%)
Oklch
oklch(94.1% 0.025 89.2)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#938C85

Ash · Gray · Warm Gray

HEX
#938C85
RGB
rgb(147, 140, 133)
HSL
hsl(30, 6%, 55%)
HSB
hsb(30, 10%, 58%)
CMYK
cmyk(0%, 5%, 10%, 42%)
Oklch
oklch(64.4% 0.013 67.6)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

#625C5E

Ink Gray · DimGray · Charcoal

HEX
#625C5E
RGB
rgb(98, 92, 94)
HSL
hsl(340, 3%, 37%)
HSB
hsb(340, 6%, 38%)
CMYK
cmyk(0%, 6%, 4%, 62%)
Oklch
oklch(48.1% 0.008 355.1)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF9600
006AFF

Analogous

FF1500
FF9600
EAFF00

Triadic

FF9600
00FF95
9500FF

Split-Comp.

FF9600
00EAFF
1500FF

Tetradic

FF9600
00FF15
006AFF
FF00EA

Contrast Matrix WCAG 2.1 Contrast

FF9600
AFD4CC
F2EBD9
938C85
625C5E
—
1.4
Fail
1.8
Fail
1.5
Fail
3.0
Fail
1.4
Fail
—
1.3
Fail
2.1
Fail
4.1
AA Large
1.8
Fail
1.3
Fail
—
2.8
Fail
5.5
AA
1.5
Fail
2.1
Fail
2.8
Fail
—
2.0
Fail
3.0
Fail
4.1
AA Large
5.5
AA
2.0
Fail
—
White BG
2.2Fail
1.6Fail
1.2Fail
3.3AA Large
6.5AA
Black BG
9.6AAA
13.1AAA
17.7AAA
6.3AA
3.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

D2D124
BFBFCE
EFEFDD
909087
5F5F5E

Deuteranopia

D8E02D
BDBACE
EFF0DE
909187
60605D

Tritanopia

FA4147
B1CFD0
F2E1E2
938888
625D5D

Achromatopsia

A4A4A4
C8C8C8
EBEBEB
8D8D8D
5E5E5E

Shades & Tints Shades & Tints

#FF9600

Dark
Light

#AFD4CC

Dark
Light

#F2EBD9

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff9600;
  --color-2: #afd4cc;
  --color-3: #f2ebd9;
  --color-4: #938c85;
  --color-5: #625c5e;
}

SCSS

$color-1: #ff9600;
$color-2: #afd4cc;
$color-3: #f2ebd9;
$color-4: #938c85;
$color-5: #625c5e;

TAILWIND

colors: {
  'brand-1': '#ff9600',
  'brand-2': '#afd4cc',
  'brand-3': '#f2ebd9',
  'brand-4': '#938c85',
  'brand-5': '#625c5e',
}

RGB Array

[255, 150, 0], [175, 212, 204], [242, 235, 217], [147, 140, 133], [98, 92, 94]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #FF9600, #AFD4CC, #F2EBD9, #938C85, #625C5E is ideal for: 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: #ff9600; --color-2: #afd4cc; --color-3: #f2ebd9; --color-4: #938c85; --color-5: #625c5e. 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 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