#F7D5D5 + #AB9079 + #B36060 + #E89D7D + #DEDB9B - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F7D5D5

Peach Pink · Bisque · Cherry Blossom

HEX

#F7D5D5

RGB

rgb(247, 213, 213)

HSL

hsl(0, 68%, 90%)

HSB

hsb(0, 14%, 97%)

CMYK

cmyk(0%, 14%, 14%, 3%)

Oklch

oklch(90.1% 0.038 17.9)

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

#AB9079

Tangerine · Gray · Warm Sun

HEX

#AB9079

RGB

rgb(171, 144, 121)

HSL

hsl(28, 23%, 57%)

HSB

hsb(28, 29%, 67%)

CMYK

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

Oklch

oklch(67.2% 0.046 62.3)

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

#B36060

Crimson · Sienna · Passion Red

HEX

#B36060

RGB

rgb(179, 96, 96)

HSL

hsl(0, 35%, 54%)

HSB

hsb(0, 46%, 70%)

CMYK

cmyk(0%, 46%, 46%, 30%)

Oklch

oklch(58.6% 0.108 20.9)

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

#E89D7D

Apricot · DarkSalmon · Warm Sun

HEX

#E89D7D

RGB

rgb(232, 157, 125)

HSL

hsl(18, 70%, 70%)

HSB

hsb(18, 46%, 91%)

CMYK

cmyk(0%, 32%, 46%, 9%)

Oklch

oklch(76.2% 0.100 43.9)

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

#DEDB9B

Fresh Green · Khaki · Sunflower

HEX

#DEDB9B

RGB

rgb(222, 219, 155)

HSL

hsl(57, 50%, 74%)

HSB

hsb(57, 30%, 87%)

CMYK

cmyk(0%, 1%, 30%, 13%)

Oklch

oklch(87.9% 0.083 105.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F7D5D5

D4F7F7

Analogous

F7D4E6

F7D5D5

F7E6D4

Triadic

F7D5D5

D4F7D4

D4D4F7

Split-Comp.

F7D5D5

D4F7E6

D4E6F7

Tetradic

F7D5D5

E6F7D4

D4F7F7

E6D4F7

Contrast Matrix WCAG 2.1 Contrast

F7D5D5	AB9079	B36060	E89D7D	DEDB9B
—	2.2 Fail	3.2 AA Large	1.6 Fail	1.0 Fail
2.2 Fail	—	1.5 Fail	1.4 Fail	2.1 Fail
3.2 AA Large	1.5 Fail	—	2.0 Fail	3.1 AA Large
1.6 Fail	1.4 Fail	2.0 Fail	—	1.5 Fail
1.0 Fail	2.1 Fail	3.1 AA Large	1.5 Fail	—

White BG

1.4Fail

3.0AA Large

4.4AA Large

2.2Fail

1.4Fail

Black BG

15.4AAA

7.0AA

4.8AA

9.6AAA

14.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E8E8D5

9F9F7F

8F8E60

C8C785

DDDDAA

Deuteranopia

EAEDD5

A1A380

949A60

CCD187

DDDDAE

Tritanopia

F5D5D5

AA8384

AF6060

E48B8C

DEB7B9

Achromatopsia

DFDFDF

959595

797979

B0B0B0

D5D5D5

Shades & Tints Shades & Tints

#F7D5D5

Dark

Light

#AB9079

Dark

Light

#B36060

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f7d5d5;
  --color-2: #ab9079;
  --color-3: #b36060;
  --color-4: #e89d7d;
  --color-5: #dedb9b;
}

SCSS

$color-1: #f7d5d5;
$color-2: #ab9079;
$color-3: #b36060;
$color-4: #e89d7d;
$color-5: #dedb9b;

TAILWIND

colors: {
  'brand-1': '#f7d5d5',
  'brand-2': '#ab9079',
  'brand-3': '#b36060',
  'brand-4': '#e89d7d',
  'brand-5': '#dedb9b',
}

RGB Array

[247, 213, 213], [171, 144, 121], [179, 96, 96], [232, 157, 125], [222, 219, 155]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F7D5D5, #AB9079, #B36060, #E89D7D, #DEDB9B 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: #f7d5d5; --color-2: #ab9079; --color-3: #b36060; --color-4: #e89d7d; --color-5: #dedb9b. 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