#F48282 + #BF796D + #836356 + #DAC39A + #DED1B1 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F48282

Peach Pink · LightCoral · Coral Red

HEX

#F48282

RGB

rgb(244, 130, 130)

HSL

hsl(0, 84%, 73%)

HSB

hsb(0, 47%, 96%)

CMYK

cmyk(0%, 47%, 47%, 4%)

Oklch

oklch(73.3% 0.140 21.0)

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

#BF796D

Crimson · DarkSalmon · Passion Red

HEX

#BF796D

RGB

rgb(191, 121, 109)

HSL

hsl(9, 39%, 59%)

HSB

hsb(9, 43%, 75%)

CMYK

cmyk(0%, 37%, 43%, 25%)

Oklch

oklch(64.7% 0.090 30.3)

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

#836356

Tangerine · DimGray · Amber Brown

HEX

#836356

RGB

rgb(131, 99, 86)

HSL

hsl(17, 21%, 43%)

HSB

hsb(17, 34%, 51%)

CMYK

cmyk(0%, 24%, 34%, 49%)

Oklch

oklch(52.9% 0.046 43.1)

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

#DAC39A

Goose Yellow · Tan · Warm Sun

HEX

#DAC39A

RGB

rgb(218, 195, 154)

HSL

hsl(38, 46%, 73%)

HSB

hsb(38, 29%, 85%)

CMYK

cmyk(0%, 11%, 29%, 15%)

Oklch

oklch(82.6% 0.060 81.9)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#DED1B1

Goose Yellow · Wheat · Lemon Cream

HEX

#DED1B1

RGB

rgb(222, 209, 177)

HSL

hsl(43, 41%, 78%)

HSB

hsb(43, 20%, 87%)

CMYK

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

Oklch

oklch(86.3% 0.045 88.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F48282

80F4F4

Analogous

F480BA

F48282

F4BA80

Triadic

F48282

80F480

8080F4

Split-Comp.

F48282

80F4BA

80BAF4

Tetradic

F48282

BAF480

80F4F4

BA80F4

Contrast Matrix WCAG 2.1 Contrast

F48282	BF796D	836356	DAC39A	DED1B1
—	1.4 Fail	2.2 Fail	1.5 Fail	1.7 Fail
1.4 Fail	—	1.6 Fail	2.0 Fail	2.2 Fail
2.2 Fail	1.6 Fail	—	3.2 AA Large	3.6 AA Large
1.5 Fail	2.0 Fail	3.2 AA Large	—	1.1 Fail
1.7 Fail	2.2 Fail	3.6 AA Large	1.1 Fail	—

White BG

2.5Fail

3.4AA Large

5.4AA

1.7Fail

1.5Fail

Black BG

8.4AAA

6.2AA

3.9AA Large

12.3AAA

13.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C3C282

A1A070

757559

D0D0A4

D8D8B9

Deuteranopia

C9D282

A5AA71

77795A

D1D3A6

D9DABB

Tritanopia

EE8282

BC7273

815C5C

D9ACAD

DDBFC0

Achromatopsia

A4A4A4

8D8D8D

6B6B6B

C5C5C5

D1D1D1

Shades & Tints Shades & Tints

#F48282

Dark

Light

#BF796D

Dark

Light

#836356

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f48282;
  --color-2: #bf796d;
  --color-3: #836356;
  --color-4: #dac39a;
  --color-5: #ded1b1;
}

SCSS

$color-1: #f48282;
$color-2: #bf796d;
$color-3: #836356;
$color-4: #dac39a;
$color-5: #ded1b1;

TAILWIND

colors: {
  'brand-1': '#f48282',
  'brand-2': '#bf796d',
  'brand-3': '#836356',
  'brand-4': '#dac39a',
  'brand-5': '#ded1b1',
}

RGB Array

[244, 130, 130], [191, 121, 109], [131, 99, 86], [218, 195, 154], [222, 209, 177]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F48282, #BF796D, #836356, #DAC39A, #DED1B1 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: #f48282; --color-2: #bf796d; --color-3: #836356; --color-4: #dac39a; --color-5: #ded1b1. 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