#BA924D + #BD5441 + #D99276 + #DDC9C3 + #F0D5B0 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BA924D

Ginger · GoldenRod · Warm Sun

HEX

#BA924D

RGB

rgb(186, 146, 77)

HSL

hsl(38, 44%, 52%)

HSB

hsb(38, 59%, 73%)

CMYK

cmyk(0%, 22%, 59%, 27%)

Oklch

oklch(68.3% 0.100 79.5)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#BD5441

Crimson · Sienna · Passion Red

HEX

#BD5441

RGB

rgb(189, 84, 65)

HSL

hsl(9, 49%, 50%)

HSB

hsb(9, 66%, 74%)

CMYK

cmyk(0%, 56%, 66%, 26%)

Oklch

oklch(57.5% 0.140 32.0)

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

#D99276

Apricot · DarkSalmon · Warm Sun

HEX

#D99276

RGB

rgb(217, 146, 118)

HSL

hsl(17, 57%, 66%)

HSB

hsb(17, 46%, 85%)

CMYK

cmyk(0%, 33%, 46%, 15%)

Oklch

oklch(72.4% 0.095 42.3)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#DDC9C3

Peach Pink · LightGray · Cherry Blossom

HEX

#DDC9C3

RGB

rgb(221, 201, 195)

HSL

hsl(14, 28%, 82%)

HSB

hsb(14, 12%, 87%)

CMYK

cmyk(0%, 9%, 12%, 13%)

Oklch

oklch(85.1% 0.024 37.4)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#F0D5B0

Goose Yellow · Wheat · Peach Orange

HEX

#F0D5B0

RGB

rgb(240, 213, 176)

HSL

hsl(35, 68%, 82%)

HSB

hsb(35, 27%, 94%)

CMYK

cmyk(0%, 11%, 27%, 6%)

Oklch

oklch(88.6% 0.057 75.6)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BA924D

4F76BA

Analogous

BA5D4F

BA924D

ACBA4F

Triadic

BA924D

4FBA93

934FBA

Split-Comp.

BA924D

4FACBA

5D4FBA

Tetradic

BA924D

4FBA5D

4F76BA

BA4FAC

Contrast Matrix WCAG 2.1 Contrast

BA924D	BD5441	D99276	DDC9C3	F0D5B0
—	1.6 Fail	1.1 Fail	1.8 Fail	2.0 Fail
1.6 Fail	—	1.8 Fail	2.9 Fail	3.3 AA Large
1.1 Fail	1.8 Fail	—	1.6 Fail	1.8 Fail
1.8 Fail	2.9 Fail	1.6 Fail	—	1.1 Fail
2.0 Fail	3.3 AA Large	1.8 Fail	1.1 Fail	—

White BG

2.9Fail

4.7AA

2.5Fail

1.6Fail

1.4Fail

Black BG

7.3AAA

4.5AA

8.3AAA

13.2AAA

14.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A9A85E

908F46

BABA7D

D4D4C4

E4E4B9

Deuteranopia

ABAE62

969D47

BEC47E

D6D7C5

E6E8BB

Tritanopia

B86B6E

B8494A

D58283

DCC6C6

EFC0C2

Achromatopsia

969696

717171

A4A4A4

CECECE

D9D9D9

Shades & Tints Shades & Tints

#BA924D

Dark

Light

#BD5441

Dark

Light

#D99276

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ba924d;
  --color-2: #bd5441;
  --color-3: #d99276;
  --color-4: #ddc9c3;
  --color-5: #f0d5b0;
}

SCSS

$color-1: #ba924d;
$color-2: #bd5441;
$color-3: #d99276;
$color-4: #ddc9c3;
$color-5: #f0d5b0;

TAILWIND

colors: {
  'brand-1': '#ba924d',
  'brand-2': '#bd5441',
  'brand-3': '#d99276',
  'brand-4': '#ddc9c3',
  'brand-5': '#f0d5b0',
}

RGB Array

[186, 146, 77], [189, 84, 65], [217, 146, 118], [221, 201, 195], [240, 213, 176]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BA924D, #BD5441, #D99276, #DDC9C3, #F0D5B0 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: #ba924d; --color-2: #bd5441; --color-3: #d99276; --color-4: #ddc9c3; --color-5: #f0d5b0. 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 general-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