#F7E2D0 + #C7C695 + #B0A7A2 + #B88C8C + #D79356 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F7E2D0

Apricot · Bisque · Peach Orange

HEX

#F7E2D0

RGB

rgb(247, 226, 208)

HSL

hsl(28, 71%, 89%)

HSB

hsb(28, 16%, 97%)

CMYK

cmyk(0%, 9%, 16%, 3%)

Oklch

oklch(92.5% 0.033 63.0)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#C7C695

Fresh Green · Tan · Sunflower

HEX

#C7C695

RGB

rgb(199, 198, 149)

HSL

hsl(59, 31%, 68%)

HSB

hsb(59, 25%, 78%)

CMYK

cmyk(0%, 1%, 25%, 22%)

Oklch

oklch(81.5% 0.065 106.8)

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

#B0A7A2

Apricot · DarkGray · Silver Sand

HEX

#B0A7A2

RGB

rgb(176, 167, 162)

HSL

hsl(21, 8%, 66%)

HSB

hsb(21, 8%, 69%)

CMYK

cmyk(0%, 5%, 8%, 31%)

Oklch

oklch(73.4% 0.013 51.3)

Traditional「Apricot」· Paint「Silver Sand」· Creative Urban Concrete

#B88C8C

Peach Pink · DarkGray · Coral Red

HEX

#B88C8C

RGB

rgb(184, 140, 140)

HSL

hsl(0, 24%, 64%)

HSB

hsb(0, 24%, 72%)

CMYK

cmyk(0%, 24%, 24%, 28%)

Oklch

oklch(68.2% 0.054 18.6)

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

#D79356

Tangerine · SandyBrown · Warm Sun

HEX

#D79356

RGB

rgb(215, 147, 86)

HSL

hsl(28, 62%, 59%)

HSB

hsb(28, 60%, 84%)

CMYK

cmyk(0%, 32%, 60%, 16%)

Oklch

oklch(71.9% 0.113 61.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F7E2D0

CFE4F7

Analogous

F7CFD0

F7E2D0

F7F6CF

Triadic

F7E2D0

CFF7E2

E2CFF7

Split-Comp.

F7E2D0

CFF7F6

CFD0F7

Tetradic

F7E2D0

D0F7CF

CFE4F7

F6CFF7

Contrast Matrix WCAG 2.1 Contrast

F7E2D0	C7C695	B0A7A2	B88C8C	D79356
—	1.4 Fail	1.9 Fail	2.3 Fail	2.0 Fail
1.4 Fail	—	1.3 Fail	1.7 Fail	1.5 Fail
1.9 Fail	1.3 Fail	—	1.2 Fail	1.1 Fail
2.3 Fail	1.7 Fail	1.2 Fail	—	1.1 Fail
2.0 Fail	1.5 Fail	1.1 Fail	1.1 Fail	—

White BG

1.3Fail

1.8Fail

2.4Fail

2.9Fail

2.6Fail

Black BG

16.7AAA

11.9AAA

8.9AAA

7.2AAA

8.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EEEED4

C7C7A1

ACACA3

A5A58C

BAB965

Deuteranopia

EFF1D5

C7C7A4

ADADA4

A8AB8C

BEC368

Tritanopia

F6D8D9

C7AAAC

B0A4A4

B68C8C

D47073

Achromatopsia

E6E6E6

C1C1C1

A9A9A9

999999

A0A0A0

Shades & Tints Shades & Tints

#F7E2D0

Dark

Light

#C7C695

Dark

Light

#B0A7A2

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f7e2d0;
  --color-2: #c7c695;
  --color-3: #b0a7a2;
  --color-4: #b88c8c;
  --color-5: #d79356;
}

SCSS

$color-1: #f7e2d0;
$color-2: #c7c695;
$color-3: #b0a7a2;
$color-4: #b88c8c;
$color-5: #d79356;

TAILWIND

colors: {
  'brand-1': '#f7e2d0',
  'brand-2': '#c7c695',
  'brand-3': '#b0a7a2',
  'brand-4': '#b88c8c',
  'brand-5': '#d79356',
}

RGB Array

[247, 226, 208], [199, 198, 149], [176, 167, 162], [184, 140, 140], [215, 147, 86]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F7E2D0, #C7C695, #B0A7A2, #B88C8C, #D79356 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: #f7e2d0; --color-2: #c7c695; --color-3: #b0a7a2; --color-4: #b88c8c; --color-5: #d79356. 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