#FFD8B5 + #E8D5BE + #F7CDCD + #C0C3C4 + #98CFD6 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FFD8B5

Apricot · Wheat · Peach Orange

HEX

#FFD8B5

RGB

rgb(255, 216, 181)

HSL

hsl(28, 100%, 85%)

HSB

hsb(28, 29%, 100%)

CMYK

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

Oklch

oklch(90.7% 0.063 63.8)

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

#E8D5BE

Goose Yellow · Wheat · Peach Orange

HEX

#E8D5BE

RGB

rgb(232, 213, 190)

HSL

hsl(33, 48%, 83%)

HSB

hsb(33, 18%, 91%)

CMYK

cmyk(0%, 8%, 18%, 9%)

Oklch

oklch(88.2% 0.037 72.6)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#F7CDCD

Peach Pink · Pink · Cherry Blossom

HEX

#F7CDCD

RGB

rgb(247, 205, 205)

HSL

hsl(0, 72%, 89%)

HSB

hsb(0, 17%, 97%)

CMYK

cmyk(0%, 17%, 17%, 3%)

Oklch

oklch(88.4% 0.048 18.1)

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

#C0C3C4

Silver Gray · Silver · Pearl Gray

HEX

#C0C3C4

RGB

rgb(192, 195, 196)

HSL

hsl(195, 3%, 76%)

HSB

hsb(195, 2%, 77%)

CMYK

cmyk(2%, 1%, 0%, 23%)

Oklch

oklch(81.5% 0.004 219.5)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

#98CFD6

Sky Blue · SkyBlue · Lake Green

HEX

#98CFD6

RGB

rgb(152, 207, 214)

HSL

hsl(187, 43%, 72%)

HSB

hsb(187, 29%, 84%)

CMYK

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

Oklch

oklch(81.9% 0.057 205.9)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFD8B5

B3DBFF

Analogous

FFB3B5

FFD8B5

FFFCB3

Triadic

FFD8B5

B3FFD6

D6B3FF

Split-Comp.

FFD8B5

B3FFFC

B3B5FF

Tetradic

FFD8B5

B5FFB3

B3DBFF

FCB3FF

Contrast Matrix WCAG 2.1 Contrast

FFD8B5	E8D5BE	F7CDCD	C0C3C4	98CFD6
—	1.1 Fail	1.1 Fail	1.3 Fail	1.3 Fail
1.1 Fail	—	1.0 Fail	1.2 Fail	1.2 Fail
1.1 Fail	1.0 Fail	—	1.2 Fail	1.2 Fail
1.3 Fail	1.2 Fail	1.2 Fail	—	1.0 Fail
1.3 Fail	1.2 Fail	1.2 Fail	1.0 Fail	—

White BG

1.3Fail

1.4Fail

1.8Fail

1.7Fail

Black BG

15.7AAA

14.7AAA

14.6AAA

11.8AAA

12.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EEEEBD

E0E0C4

E5E4CD

C1C1C4

B0B0D4

Deuteranopia

F0F3C0

E1E2C5

E7EACD

C1C1C4

ADA9D4

Tritanopia

FDC4C6

E7C8C9

F5CDCD

C0C4C4

9BD3D3

Achromatopsia

E0E0E0

D8D8D8

DADADA

C2C2C2

BFBFBF

Shades & Tints Shades & Tints

#FFD8B5

Dark

Light

#E8D5BE

Dark

Light

#F7CDCD

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffd8b5;
  --color-2: #e8d5be;
  --color-3: #f7cdcd;
  --color-4: #c0c3c4;
  --color-5: #98cfd6;
}

SCSS

$color-1: #ffd8b5;
$color-2: #e8d5be;
$color-3: #f7cdcd;
$color-4: #c0c3c4;
$color-5: #98cfd6;

TAILWIND

colors: {
  'brand-1': '#ffd8b5',
  'brand-2': '#e8d5be',
  'brand-3': '#f7cdcd',
  'brand-4': '#c0c3c4',
  'brand-5': '#98cfd6',
}

RGB Array

[255, 216, 181], [232, 213, 190], [247, 205, 205], [192, 195, 196], [152, 207, 214]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFD8B5, #E8D5BE, #F7CDCD, #C0C3C4, #98CFD6 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: #ffd8b5; --color-2: #e8d5be; --color-3: #f7cdcd; --color-4: #c0c3c4; --color-5: #98cfd6. 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