#FFA96B + #F29783 + #D68DB1 + #A48ED1 + #888391 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FFA96B

Apricot · SandyBrown · Warm Sun

HEX

#FFA96B

RGB

rgb(255, 169, 107)

HSL

hsl(25, 100%, 71%)

HSB

hsb(25, 58%, 100%)

CMYK

cmyk(0%, 34%, 58%, 0%)

Oklch

oklch(80.7% 0.128 55.6)

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

#F29783

Peach Pink · DarkSalmon · Coral Red

HEX

#F29783

RGB

rgb(242, 151, 131)

HSL

hsl(11, 81%, 73%)

HSB

hsb(11, 46%, 95%)

CMYK

cmyk(0%, 38%, 46%, 5%)

Oklch

oklch(76.5% 0.114 33.1)

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

#D68DB1

Rouge · Orchid · Rose Pink

HEX

#D68DB1

RGB

rgb(214, 141, 177)

HSL

hsl(330, 47%, 70%)

HSB

hsb(330, 34%, 84%)

CMYK

cmyk(0%, 34%, 17%, 16%)

Oklch

oklch(72.8% 0.099 348.8)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#A48ED1

Wisteria · DarkGray · Lilac Purple

HEX

#A48ED1

RGB

rgb(164, 142, 209)

HSL

hsl(260, 42%, 69%)

HSB

hsb(260, 32%, 82%)

CMYK

cmyk(22%, 32%, 0%, 18%)

Oklch

oklch(69.1% 0.099 298.9)

Traditional「Wisteria」· Paint「Lilac Purple」· Creative Lavender Dream

#888391

Ash · Gray · Warm Gray

HEX

#888391

RGB

rgb(136, 131, 145)

HSL

hsl(261, 6%, 54%)

HSB

hsb(261, 10%, 57%)

CMYK

cmyk(6%, 10%, 0%, 43%)

Oklch

oklch(61.9% 0.022 302.0)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFA96B

6BC1FF

Analogous

FF6B77

FFA96B

FFF36B

Triadic

FFA96B

6BFFA9

A96BFF

Split-Comp.

FFA96B

6BFFF3

6B77FF

Tetradic

FFA96B

77FF6B

6BC1FF

F36BFF

Contrast Matrix WCAG 2.1 Contrast

FFA96B	F29783	D68DB1	A48ED1	888391
—	1.2 Fail	1.3 Fail	1.5 Fail	2.0 Fail
1.2 Fail	—	1.1 Fail	1.3 Fail	1.7 Fail
1.3 Fail	1.1 Fail	—	1.1 Fail	1.5 Fail
1.5 Fail	1.3 Fail	1.1 Fail	—	1.3 Fail
2.0 Fail	1.7 Fail	1.5 Fail	1.3 Fail	—

White BG

1.9Fail

2.2Fail

2.5Fail

2.9Fail

3.7AA Large

Black BG

11.1AAA

9.5AAA

8.3AAA

7.4AAA

5.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DAD97A

CBCA88

B6B6A8

9A9AC1

86868E

Deuteranopia

DFE57E

D0D789

BBC0A6

9C9DBD

86878D

Tritanopia

FB8688

ED8C8D

D2A1A0

A3B4B1

888B8A

Achromatopsia

BCBCBC

B0B0B0

A7A7A7

9C9C9C

868686

Shades & Tints Shades & Tints

#FFA96B

Dark

Light

#F29783

Dark

Light

#D68DB1

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffa96b;
  --color-2: #f29783;
  --color-3: #d68db1;
  --color-4: #a48ed1;
  --color-5: #888391;
}

SCSS

$color-1: #ffa96b;
$color-2: #f29783;
$color-3: #d68db1;
$color-4: #a48ed1;
$color-5: #888391;

TAILWIND

colors: {
  'brand-1': '#ffa96b',
  'brand-2': '#f29783',
  'brand-3': '#d68db1',
  'brand-4': '#a48ed1',
  'brand-5': '#888391',
}

RGB Array

[255, 169, 107], [242, 151, 131], [214, 141, 177], [164, 142, 209], [136, 131, 145]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFA96B, #F29783, #D68DB1, #A48ED1, #888391 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: #ffa96b; --color-2: #f29783; --color-3: #d68db1; --color-4: #a48ed1; --color-5: #888391. 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