#E3C875 + #98B37D + #31B58D + #85858C + #E68475 · 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

#E3C875

Ginger · BurlyWood · Sunflower

HEX

#E3C875

RGB

rgb(227, 200, 117)

HSL

hsl(45, 66%, 67%)

HSB

hsb(45, 48%, 89%)

CMYK

cmyk(0%, 12%, 48%, 11%)

Oklch

oklch(83.8% 0.107 91.9)

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

#98B37D

Celadon · DarkSeaGreen · Olive Green

HEX

#98B37D

RGB

rgb(152, 179, 125)

HSL

hsl(90, 26%, 60%)

HSB

hsb(90, 30%, 70%)

CMYK

cmyk(15%, 0%, 30%, 30%)

Oklch

oklch(73.2% 0.080 129.8)

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

#31B58D

Mineral Blue · MediumSeaGreen · Mint Ice

HEX

#31B58D

RGB

rgb(49, 181, 141)

HSL

hsl(162, 57%, 45%)

HSB

hsb(162, 73%, 71%)

CMYK

cmyk(73%, 0%, 22%, 29%)

Oklch

oklch(69.3% 0.127 167.9)

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

#85858C

Ash · Gray · Warm Gray

HEX

#85858C

RGB

rgb(133, 133, 140)

HSL

hsl(240, 3%, 54%)

HSB

hsb(240, 5%, 55%)

CMYK

cmyk(5%, 5%, 0%, 45%)

Oklch

oklch(61.9% 0.010 286.1)

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

#E68475

Peach Pink · LightCoral · Coral Red

HEX

#E68475

RGB

rgb(230, 132, 117)

HSL

hsl(8, 69%, 68%)

HSB

hsb(8, 49%, 90%)

CMYK

cmyk(0%, 43%, 49%, 10%)

Oklch

oklch(71.6% 0.123 29.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E3C875

738FE2

Analogous

E28F73

E3C875

C7E273

Triadic

E3C875

73E2C7

C773E2

Split-Comp.

E3C875

73C7E2

8F73E2

Tetradic

E3C875

73E28F

738FE2

E273C7

Contrast Matrix WCAG 2.1 Contrast

E3C875	98B37D	31B58D	85858C	E68475
—	1.4 Fail	1.6 Fail	2.2 Fail	1.6 Fail
1.4 Fail	—	1.1 Fail	1.6 Fail	1.1 Fail
1.6 Fail	1.1 Fail	—	1.4 Fail	1.0 Fail
2.2 Fail	1.6 Fail	1.4 Fail	—	1.4 Fail
1.6 Fail	1.1 Fail	1.0 Fail	1.4 Fail	—

White BG

1.6Fail

2.3Fail

2.6Fail

3.7AA Large

2.7Fail

Black BG

12.8AAA

9.1AAA

8.1AAA

5.7AA

7.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D7D789

A4A48A

6A6B97

85858A

BCBB79

Deuteranopia

D9DB8E

A2A08D

635999

85858A

C1C97A

Tritanopia

E2999C

999497

389EA0

858989

E17B7C

Achromatopsia

C7C7C7

A5A5A5

898989

868686

A0A0A0

Shades & Tints Shades & Tints

#E3C875

Dark

Light

#98B37D

Dark

Light

#31B58D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e3c875;
  --color-2: #98b37d;
  --color-3: #31b58d;
  --color-4: #85858c;
  --color-5: #e68475;
}

SCSS

$color-1: #e3c875;
$color-2: #98b37d;
$color-3: #31b58d;
$color-4: #85858c;
$color-5: #e68475;

TAILWIND

colors: {
  'brand-1': '#e3c875',
  'brand-2': '#98b37d',
  'brand-3': '#31b58d',
  'brand-4': '#85858c',
  'brand-5': '#e68475',
}

RGB Array

[227, 200, 117], [152, 179, 125], [49, 181, 141], [133, 133, 140], [230, 132, 117]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #E3C875, #98B37D, #31B58D, #85858C, #E68475 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: #e3c875; --color-2: #98b37d; --color-3: #31b58d; --color-4: #85858c; --color-5: #e68475. 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