#F0C0A8 + #F0D8A8 + #A8C090 + #789090 + #787878 · pastel - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarmCool

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#F0C0A8

Apricot · LightPink · Peach Orange

HEX

#F0C0A8

RGB

rgb(240, 192, 168)

HSL

hsl(20, 71%, 80%)

HSB

hsb(20, 30%, 94%)

CMYK

cmyk(0%, 20%, 30%, 6%)

Oklch

oklch(84.4% 0.064 47.9)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#F0D8A8

Goose Yellow · Wheat · Lemon Cream

HEX

#F0D8A8

RGB

rgb(240, 216, 168)

HSL

hsl(40, 71%, 80%)

HSB

hsb(40, 30%, 94%)

CMYK

cmyk(0%, 10%, 30%, 6%)

Oklch

oklch(89.0% 0.068 84.4)

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

#A8C090

Celadon · DarkSeaGreen · Apple Green

HEX

#A8C090

RGB

rgb(168, 192, 144)

HSL

hsl(90, 28%, 66%)

HSB

hsb(90, 25%, 75%)

CMYK

cmyk(13%, 0%, 25%, 25%)

Oklch

oklch(77.7% 0.071 129.5)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#789090

Slate Blue · LightSlateGray · Lake Green

HEX

#789090

RGB

rgb(120, 144, 144)

HSL

hsl(180, 10%, 52%)

HSB

hsb(180, 17%, 56%)

CMYK

cmyk(17%, 0%, 0%, 44%)

Oklch

oklch(63.5% 0.027 196.5)

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

#787878

Ink Gray · Gray · Warm Gray

HEX

#787878

RGB

rgb(120, 120, 120)

HSL

hsl(0, 0%, 47%)

HSB

hsb(0, 0%, 47%)

CMYK

cmyk(0%, 0%, 0%, 53%)

Oklch

oklch(57.3% 0.000 89.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F0C0A8

A8D8F0

Analogous

F0A8B4

F0C0A8

F0E4A8

Triadic

F0C0A8

A8F0C0

C0A8F0

Split-Comp.

F0C0A8

A8F0E4

A8B4F0

Tetradic

F0C0A8

B4F0A8

A8D8F0

E4A8F0

Contrast Matrix WCAG 2.1 Contrast

F0C0A8	F0D8A8	A8C090	789090	787878
—	1.2 Fail	1.2 Fail	2.1 Fail	2.7 Fail
1.2 Fail	—	1.4 Fail	2.4 Fail	3.2 AA Large
1.2 Fail	1.4 Fail	—	1.7 Fail	2.2 Fail
2.1 Fail	2.4 Fail	1.7 Fail	—	1.3 Fail
2.7 Fail	3.2 AA Large	2.2 Fail	1.3 Fail	—

White BG

1.6Fail

1.4Fail

2.0Fail

3.4AA Large

4.4AA Large

Black BG

12.8AAA

15.1AAA

10.6AAA

6.2AA

4.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DBDBAE

E6E5B4

B2B39C

828390

787878

Deuteranopia

DEE2AF

E7E9B6

B1AF9E

817F90

787878

Tritanopia

EEB2B3

EFBDBF

A9A5A7

799090

787878

Achromatopsia

CCCCCC

DADADA

B3B3B3

898989

787878

Shades & Tints Shades & Tints

#F0C0A8

Dark

Light

#F0D8A8

Dark

Light

#A8C090

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f0c0a8;
  --color-2: #f0d8a8;
  --color-3: #a8c090;
  --color-4: #789090;
  --color-5: #787878;
}

SCSS

$color-1: #f0c0a8;
$color-2: #f0d8a8;
$color-3: #a8c090;
$color-4: #789090;
$color-5: #787878;

TAILWIND

colors: {
  'brand-1': '#f0c0a8',
  'brand-2': '#f0d8a8',
  'brand-3': '#a8c090',
  'brand-4': '#789090',
  'brand-5': '#787878',
}

RGB Array

[240, 192, 168], [240, 216, 168], [168, 192, 144], [120, 144, 144], [120, 120, 120]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #F0C0A8, #F0D8A8, #A8C090, #789090, #787878 is ideal for: corporate websites, product showcases, portfolios. 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: #f0c0a8; --color-2: #f0d8a8; --color-3: #a8c090; --color-4: #789090; --color-5: #787878. 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. 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