#7A5B60 + #B4A997 + #B1DBB3 + #D8D6AD + #F09C80 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#7A5B60

Crimson · DimGray · Passion Red

HEX

#7A5B60

RGB

rgb(122, 91, 96)

HSL

hsl(350, 15%, 42%)

HSB

hsb(350, 25%, 48%)

CMYK

cmyk(0%, 25%, 21%, 52%)

Oklch

oklch(50.5% 0.041 7.9)

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

#B4A997

Ginger · DarkGray · Warm Sun

HEX

#B4A997

RGB

rgb(180, 169, 151)

HSL

hsl(37, 16%, 65%)

HSB

hsb(37, 16%, 71%)

CMYK

cmyk(0%, 6%, 16%, 29%)

Oklch

oklch(73.9% 0.028 80.2)

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

#B1DBB3

Celadon · Silver · Apple Green

HEX

#B1DBB3

RGB

rgb(177, 219, 179)

HSL

hsl(123, 37%, 78%)

HSB

hsb(123, 19%, 86%)

CMYK

cmyk(19%, 0%, 18%, 14%)

Oklch

oklch(85.1% 0.070 146.2)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#D8D6AD

Fresh Green · Wheat · Lemon Cream

HEX

#D8D6AD

RGB

rgb(216, 214, 173)

HSL

hsl(57, 36%, 76%)

HSB

hsb(57, 20%, 85%)

CMYK

cmyk(0%, 1%, 20%, 15%)

Oklch

oklch(86.7% 0.054 105.2)

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

#F09C80

Apricot · DarkSalmon · Warm Sun

HEX

#F09C80

RGB

rgb(240, 156, 128)

HSL

hsl(15, 79%, 72%)

HSB

hsb(15, 47%, 94%)

CMYK

cmyk(0%, 35%, 47%, 6%)

Oklch

oklch(77.0% 0.109 39.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7A5B60

5B7B76

Analogous

7B5B70

7A5B60

7B665B

Triadic

7A5B60

607B5B

5B607B

Split-Comp.

7A5B60

5B7B66

5B707B

Tetradic

7A5B60

707B5B

5B7B76

665B7B

Contrast Matrix WCAG 2.1 Contrast

7A5B60	B4A997	B1DBB3	D8D6AD	F09C80
—	2.6 Fail	3.9 AA Large	4.0 AA Large	2.8 Fail
2.6 Fail	—	1.5 Fail	1.6 Fail	1.1 Fail
3.9 AA Large	1.5 Fail	—	1.0 Fail	1.4 Fail
4.0 AA Large	1.6 Fail	1.0 Fail	—	1.4 Fail
2.8 Fail	1.1 Fail	1.4 Fail	1.4 Fail	—

White BG

6.0AA

2.3Fail

1.5Fail

2.1Fail

Black BG

3.5AA Large

9.1AAA

13.7AAA

14.1AAA

9.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6D6C5F

AFAF9B

C3C4BD

D7D7B7

CCCB87

Deuteranopia

6E715E

B0B19C

C1BEBF

D7D7B9

D1D788

Tritanopia

785E5E

B39FA0

B3C4C6

D8BFC0

EC8C8D

Achromatopsia

656565

AAAAAA

CACACA

D2D2D2

B2B2B2

Shades & Tints Shades & Tints

#7A5B60

Dark

Light

#B4A997

Dark

Light

#B1DBB3

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7a5b60;
  --color-2: #b4a997;
  --color-3: #b1dbb3;
  --color-4: #d8d6ad;
  --color-5: #f09c80;
}

SCSS

$color-1: #7a5b60;
$color-2: #b4a997;
$color-3: #b1dbb3;
$color-4: #d8d6ad;
$color-5: #f09c80;

TAILWIND

colors: {
  'brand-1': '#7a5b60',
  'brand-2': '#b4a997',
  'brand-3': '#b1dbb3',
  'brand-4': '#d8d6ad',
  'brand-5': '#f09c80',
}

RGB Array

[122, 91, 96], [180, 169, 151], [177, 219, 179], [216, 214, 173], [240, 156, 128]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7A5B60, #B4A997, #B1DBB3, #D8D6AD, #F09C80 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: #7a5b60; --color-2: #b4a997; --color-3: #b1dbb3; --color-4: #d8d6ad; --color-5: #f09c80. 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