#9078A8 + #90A890 + #A8C0D8 + #FFE15C + #FFA6B8 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#9078A8

Dark Plum · LightSlateGray · Violet

HEX

#9078A8

RGB

rgb(144, 120, 168)

HSL

hsl(270, 22%, 56%)

HSB

hsb(270, 29%, 66%)

CMYK

cmyk(14%, 29%, 0%, 34%)

Oklch

oklch(61.3% 0.076 307.1)

Traditional「Dark Plum」· Paint「Violet」· Creative Blush Sunrise

#90A890

Celadon · DarkSeaGreen · Apple Green

HEX

#90A890

RGB

rgb(144, 168, 144)

HSL

hsl(120, 12%, 61%)

HSB

hsb(120, 14%, 66%)

CMYK

cmyk(14%, 0%, 14%, 34%)

Oklch

oklch(70.6% 0.044 145.1)

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

#A8C0D8

Azure · LightSteelBlue · Cobalt Blue

HEX

#A8C0D8

RGB

rgb(168, 192, 216)

HSL

hsl(210, 38%, 75%)

HSB

hsb(210, 22%, 85%)

CMYK

cmyk(22%, 11%, 0%, 15%)

Oklch

oklch(79.8% 0.043 248.4)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#FFE15C

Ginger · Khaki · Sunflower

HEX

#FFE15C

RGB

rgb(255, 225, 92)

HSL

hsl(49, 100%, 68%)

HSB

hsb(49, 64%, 100%)

CMYK

cmyk(0%, 12%, 64%, 0%)

Oklch

oklch(91.1% 0.153 96.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#FFA6B8

Peach Pink · LightPink · Cherry Blossom

HEX

#FFA6B8

RGB

rgb(255, 166, 184)

HSL

hsl(348, 100%, 83%)

HSB

hsb(348, 35%, 100%)

CMYK

cmyk(0%, 35%, 28%, 0%)

Oklch

oklch(81.8% 0.107 6.5)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9078A8

8FA776

Analogous

7676A7

9078A8

A776A7

Triadic

9078A8

A78F76

76A78F

Split-Comp.

9078A8

A7A776

76A776

Tetradic

9078A8

A77676

8FA776

76A7A7

Contrast Matrix WCAG 2.1 Contrast

9078A8	90A890	A8C0D8	FFE15C	FFA6B8
—	1.5 Fail	2.1 Fail	3.0 Fail	2.1 Fail
1.5 Fail	—	1.4 Fail	2.0 Fail	1.4 Fail
2.1 Fail	1.4 Fail	—	1.4 Fail	1.0 Fail
3.0 Fail	2.0 Fail	1.4 Fail	—	1.4 Fail
2.1 Fail	1.4 Fail	1.0 Fail	1.4 Fail	—

White BG

3.9AA Large

2.6Fail

1.9Fail

1.3Fail

1.8Fail

Black BG

5.4AA

8.2AAA

11.2AAA

16.2AAA

11.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

86859C

9A9B96

B2B3D2

F2F27C

D8D8B4

Deuteranopia

87899A

999797

B1AFD1

F4F684

DEE4B3

Tritanopia

8F9391

919A9B

A9CECD

FE969B

FBB0AF

Achromatopsia

858585

9E9E9E

BCBCBC

DBDBDB

C3C3C3

Shades & Tints Shades & Tints

#9078A8

Dark

Light

#90A890

Dark

Light

#A8C0D8

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9078a8;
  --color-2: #90a890;
  --color-3: #a8c0d8;
  --color-4: #ffe15c;
  --color-5: #ffa6b8;
}

SCSS

$color-1: #9078a8;
$color-2: #90a890;
$color-3: #a8c0d8;
$color-4: #ffe15c;
$color-5: #ffa6b8;

TAILWIND

colors: {
  'brand-1': '#9078a8',
  'brand-2': '#90a890',
  'brand-3': '#a8c0d8',
  'brand-4': '#ffe15c',
  'brand-5': '#ffa6b8',
}

RGB Array

[144, 120, 168], [144, 168, 144], [168, 192, 216], [255, 225, 92], [255, 166, 184]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9078A8, #90A890, #A8C0D8, #FFE15C, #FFA6B8 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: #9078a8; --color-2: #90a890; --color-3: #a8c0d8; --color-4: #ffe15c; --color-5: #ffa6b8. 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