#FFA799 + #F7C497 + #B0CD9F + #B99D8F + #D0DCB6 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FFA799

Peach Pink · LightSalmon · Coral Red

HEX

#FFA799

RGB

rgb(255, 167, 153)

HSL

hsl(8, 100%, 80%)

HSB

hsb(8, 40%, 100%)

CMYK

cmyk(0%, 35%, 40%, 0%)

Oklch

oklch(81.2% 0.107 29.5)

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

#F7C497

Apricot · BurlyWood · Peach Orange

HEX

#F7C497

RGB

rgb(247, 196, 151)

HSL

hsl(28, 86%, 78%)

HSB

hsb(28, 39%, 97%)

CMYK

cmyk(0%, 21%, 39%, 3%)

Oklch

oklch(85.5% 0.083 62.8)

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

#B0CD9F

Celadon · DarkGray · Apple Green

HEX

#B0CD9F

RGB

rgb(176, 205, 159)

HSL

hsl(98, 32%, 71%)

HSB

hsb(98, 22%, 80%)

CMYK

cmyk(14%, 0%, 22%, 20%)

Oklch

oklch(81.5% 0.070 134.1)

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

#B99D8F

Apricot · DarkGray · Warm Sun

HEX

#B99D8F

RGB

rgb(185, 157, 143)

HSL

hsl(20, 23%, 64%)

HSB

hsb(20, 23%, 73%)

CMYK

cmyk(0%, 15%, 23%, 27%)

Oklch

oklch(71.7% 0.039 48.2)

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

#D0DCB6

Willow Green · LightGray · Apple Green

HEX

#D0DCB6

RGB

rgb(208, 220, 182)

HSL

hsl(79, 35%, 79%)

HSB

hsb(79, 17%, 86%)

CMYK

cmyk(5%, 0%, 17%, 14%)

Oklch

oklch(87.5% 0.052 121.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFA799

99F1FF

Analogous

FF99BE

FFA799

FFDA99

Triadic

FFA799

99FFA7

A799FF

Split-Comp.

FFA799

99FFDA

99BEFF

Tetradic

FFA799

BEFF99

99F1FF

DA99FF

Contrast Matrix WCAG 2.1 Contrast

FFA799	F7C497	B0CD9F	B99D8F	D0DCB6
—	1.2 Fail	1.1 Fail	1.4 Fail	1.3 Fail
1.2 Fail	—	1.1 Fail	1.6 Fail	1.1 Fail
1.1 Fail	1.1 Fail	—	1.5 Fail	1.2 Fail
1.4 Fail	1.6 Fail	1.5 Fail	—	1.8 Fail
1.3 Fail	1.1 Fail	1.2 Fail	1.8 Fail	—

White BG

1.9Fail

1.6Fail

1.7Fail

2.5Fail

1.4Fail

Black BG

11.2AAA

13.3AAA

12.1AAA

8.3AAA

14.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D9D89C

E1E0A2

BDBDAA

ADAD92

D5D5BF

Deuteranopia

DEE59D

E4E8A5

BBB9AD

AFB193

D5D4C1

Tritanopia

FB9FA0

F4AAAC

B1B3B5

B89596

D1C6C8

Achromatopsia

C0C0C0

CECECE

BFBFBF

A4A4A4

D4D4D4

Shades & Tints Shades & Tints

#FFA799

Dark

Light

#F7C497

Dark

Light

#B0CD9F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffa799;
  --color-2: #f7c497;
  --color-3: #b0cd9f;
  --color-4: #b99d8f;
  --color-5: #d0dcb6;
}

SCSS

$color-1: #ffa799;
$color-2: #f7c497;
$color-3: #b0cd9f;
$color-4: #b99d8f;
$color-5: #d0dcb6;

TAILWIND

colors: {
  'brand-1': '#ffa799',
  'brand-2': '#f7c497',
  'brand-3': '#b0cd9f',
  'brand-4': '#b99d8f',
  'brand-5': '#d0dcb6',
}

RGB Array

[255, 167, 153], [247, 196, 151], [176, 205, 159], [185, 157, 143], [208, 220, 182]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFA799, #F7C497, #B0CD9F, #B99D8F, #D0DCB6 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: #ffa799; --color-2: #f7c497; --color-3: #b0cd9f; --color-4: #b99d8f; --color-5: #d0dcb6. 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