#B8AD93 + #D78124 + #C5484A + #686D3D + #3F8F58 · pastel - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarm

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#B8AD93

Ginger · DarkGray · Sunflower

HEX

#B8AD93

RGB

rgb(184, 173, 147)

HSL

hsl(42, 21%, 65%)

HSB

hsb(42, 20%, 72%)

CMYK

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

Oklch

oklch(75.0% 0.038 87.8)

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

#D78124

Ochre · Chocolate · Amber Brown

HEX

#D78124

RGB

rgb(215, 129, 36)

HSL

hsl(31, 71%, 49%)

HSB

hsb(31, 83%, 84%)

CMYK

cmyk(0%, 40%, 83%, 16%)

Oklch

oklch(68.1% 0.145 61.7)

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

#C5484A

Crimson · Sienna · Passion Red

HEX

#C5484A

RGB

rgb(197, 72, 74)

HSL

hsl(359, 52%, 53%)

HSB

hsb(359, 63%, 77%)

CMYK

cmyk(0%, 63%, 62%, 23%)

Oklch

oklch(57.3% 0.160 22.7)

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

#686D3D

Autumn Sage · DarkOliveGreen · Honey Gold

HEX

#686D3D

RGB

rgb(104, 109, 61)

HSL

hsl(66, 28%, 33%)

HSB

hsb(66, 44%, 43%)

CMYK

cmyk(5%, 0%, 44%, 57%)

Oklch

oklch(51.8% 0.069 113.7)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#3F8F58

Celadon · SeaGreen · Forest Green

HEX

#3F8F58

RGB

rgb(63, 143, 88)

HSL

hsl(139, 39%, 40%)

HSB

hsb(139, 56%, 56%)

CMYK

cmyk(56%, 0%, 38%, 44%)

Oklch

oklch(58.5% 0.115 151.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B8AD93

939EB8

Analogous

B89B93

B8AD93

B1B893

Triadic

B8AD93

93B8AD

AD93B8

Split-Comp.

B8AD93

93B1B8

9B93B8

Tetradic

B8AD93

93B89B

939EB8

B893B1

Contrast Matrix WCAG 2.1 Contrast

B8AD93	D78124	C5484A	686D3D	3F8F58
—	1.3 Fail	2.1 Fail	2.5 Fail	1.8 Fail
1.3 Fail	—	1.6 Fail	1.8 Fail	1.3 Fail
2.1 Fail	1.6 Fail	—	1.1 Fail	1.2 Fail
2.5 Fail	1.8 Fail	1.1 Fail	—	1.4 Fail
1.8 Fail	1.3 Fail	1.2 Fail	1.4 Fail	—

White BG

2.2Fail

3.0Fail

4.8AA

5.5AA

4.0AA Large

Black BG

9.4AAA

7.1AAA

4.4AA Large

3.8AA Large

5.3AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B3B399

B2B13B

8F8E4A

6A6A49

626265

Deuteranopia

B4B59B

B7BD40

969F49

6A6A4B

5D5769

Tritanopia

B79E9F

D34C50

BF4949

685254

437072

Achromatopsia

ADADAD

909090

6E6E6E

666666

717171

Shades & Tints Shades & Tints

#B8AD93

Dark

Light

#D78124

Dark

Light

#C5484A

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b8ad93;
  --color-2: #d78124;
  --color-3: #c5484a;
  --color-4: #686d3d;
  --color-5: #3f8f58;
}

SCSS

$color-1: #b8ad93;
$color-2: #d78124;
$color-3: #c5484a;
$color-4: #686d3d;
$color-5: #3f8f58;

TAILWIND

colors: {
  'brand-1': '#b8ad93',
  'brand-2': '#d78124',
  'brand-3': '#c5484a',
  'brand-4': '#686d3d',
  'brand-5': '#3f8f58',
}

RGB Array

[184, 173, 147], [215, 129, 36], [197, 72, 74], [104, 109, 61], [63, 143, 88]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #B8AD93, #D78124, #C5484A, #686D3D, #3F8F58 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: #b8ad93; --color-2: #d78124; --color-3: #c5484a; --color-4: #686d3d; --color-5: #3f8f58. 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