#ABA289 + #BAB195 + #D1C59F + #D0DB8F + #DEE68C · 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

#ABA289

Ginger · DarkGray · Sunflower

HEX

#ABA289

RGB

rgb(171, 162, 137)

HSL

hsl(44, 17%, 60%)

HSB

hsb(44, 20%, 67%)

CMYK

cmyk(0%, 5%, 20%, 33%)

Oklch

oklch(71.3% 0.037 90.6)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#BAB195

Ginger · Tan · Sunflower

HEX

#BAB195

RGB

rgb(186, 177, 149)

HSL

hsl(45, 21%, 66%)

HSB

hsb(45, 20%, 73%)

CMYK

cmyk(0%, 5%, 20%, 27%)

Oklch

oklch(76.0% 0.040 92.3)

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

#D1C59F

Goose Yellow · Tan · Sunflower

HEX

#D1C59F

RGB

rgb(209, 197, 159)

HSL

hsl(46, 35%, 72%)

HSB

hsb(46, 24%, 82%)

CMYK

cmyk(0%, 6%, 24%, 18%)

Oklch

oklch(82.4% 0.053 92.6)

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

#D0DB8F

Fresh Green · Khaki · Sunflower

HEX

#D0DB8F

RGB

rgb(208, 219, 143)

HSL

hsl(69, 51%, 71%)

HSB

hsb(69, 35%, 86%)

CMYK

cmyk(5%, 0%, 35%, 14%)

Oklch

oklch(86.5% 0.099 115.2)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#DEE68C

Fresh Green · Khaki · Sunflower

HEX

#DEE68C

RGB

rgb(222, 230, 140)

HSL

hsl(65, 64%, 73%)

HSB

hsb(65, 39%, 90%)

CMYK

cmyk(3%, 0%, 39%, 10%)

Oklch

oklch(89.9% 0.114 112.8)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ABA289

8891AA

Analogous

AA9088

ABA289

A2AA88

Triadic

ABA289

88AAA1

A188AA

Split-Comp.

ABA289

88A2AA

9088AA

Tetradic

ABA289

88AA90

8891AA

AA88A2

Contrast Matrix WCAG 2.1 Contrast

ABA289	BAB195	D1C59F	D0DB8F	DEE68C
—	1.2 Fail	1.5 Fail	1.7 Fail	1.9 Fail
1.2 Fail	—	1.2 Fail	1.4 Fail	1.6 Fail
1.5 Fail	1.2 Fail	—	1.2 Fail	1.3 Fail
1.7 Fail	1.4 Fail	1.2 Fail	—	1.1 Fail
1.9 Fail	1.6 Fail	1.3 Fail	1.1 Fail	—

White BG

2.5Fail

2.1Fail

1.7Fail

1.5Fail

1.3Fail

Black BG

8.3AAA

9.8AAA

12.2AAA

14.2AAA

15.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A7A78F

B6B69C

CCCCA8

D5D5A1

E1E2A2

Deuteranopia

A8A891

B7B79D

CDCDAA

D4D3A6

E1E0A7

Tritanopia

AB9495

BAA1A2

D0AFB1

D1B0B3

DEB3B7

Achromatopsia

A2A2A2

B0B0B0

C4C4C4

CFCFCF

D9D9D9

Shades & Tints Shades & Tints

#ABA289

Dark

Light

#BAB195

Dark

Light

#D1C59F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #aba289;
  --color-2: #bab195;
  --color-3: #d1c59f;
  --color-4: #d0db8f;
  --color-5: #dee68c;
}

SCSS

$color-1: #aba289;
$color-2: #bab195;
$color-3: #d1c59f;
$color-4: #d0db8f;
$color-5: #dee68c;

TAILWIND

colors: {
  'brand-1': '#aba289',
  'brand-2': '#bab195',
  'brand-3': '#d1c59f',
  'brand-4': '#d0db8f',
  'brand-5': '#dee68c',
}

RGB Array

[171, 162, 137], [186, 177, 149], [209, 197, 159], [208, 219, 143], [222, 230, 140]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #ABA289, #BAB195, #D1C59F, #D0DB8F, #DEE68C is ideal for: health products, baby brands, fresh-style blogs. 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: #aba289; --color-2: #bab195; --color-3: #d1c59f; --color-4: #d0db8f; --color-5: #dee68c. 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. 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