← Back to Editor

#9AE4B0 · #F2F2A3 · #F5CE9C · #F488D5 · #746B89

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#9AE4B0

Emerald · LightGreen · Apple Green

HEX
#9AE4B0
RGB
rgb(154, 228, 176)
HSL
hsl(138, 58%, 75%)
HSB
hsb(138, 32%, 89%)
CMYK
cmyk(32%, 0%, 23%, 11%)
Oklch
oklch(85.6% 0.103 153.2)

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

#F2F2A3

Fresh Green · Wheat · Lemon Cream

HEX
#F2F2A3
RGB
rgb(242, 242, 163)
HSL
hsl(60, 75%, 79%)
HSB
hsb(60, 33%, 95%)
CMYK
cmyk(0%, 0%, 33%, 5%)
Oklch
oklch(94.3% 0.100 108.2)

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

#F5CE9C

Goose Yellow · Wheat · Peach Orange

HEX
#F5CE9C
RGB
rgb(245, 206, 156)
HSL
hsl(34, 82%, 79%)
HSB
hsb(34, 36%, 96%)
CMYK
cmyk(0%, 16%, 36%, 4%)
Oklch
oklch(87.3% 0.078 73.4)

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

#F488D5

Mauve · Violet · Lilac Purple

HEX
#F488D5
RGB
rgb(244, 136, 213)
HSL
hsl(317, 83%, 75%)
HSB
hsb(317, 44%, 96%)
CMYK
cmyk(0%, 44%, 13%, 4%)
Oklch
oklch(76.7% 0.160 338.9)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

#746B89

Deep Indigo · SlateGray · Navy Blue

HEX
#746B89
RGB
rgb(116, 107, 137)
HSL
hsl(258, 12%, 48%)
HSB
hsb(258, 22%, 54%)
CMYK
cmyk(15%, 22%, 0%, 46%)
Oklch
oklch(54.7% 0.047 298.6)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9AE4B0
E49ACE

Analogous

A9E49A
9AE4B0
9AE4D5

Triadic

9AE4B0
B09AE4
E4B09A

Split-Comp.

9AE4B0
D59AE4
E49AA9

Tetradic

9AE4B0
9AA9E4
E49ACE
E4D59A

Contrast Matrix WCAG 2.1 Contrast

9AE4B0
F2F2A3
F5CE9C
F488D5
746B89
—
1.3
Fail
1.0
Fail
1.5
Fail
3.4
AA Large
1.3
Fail
—
1.3
Fail
1.9
Fail
4.3
AA Large
1.0
Fail
1.3
Fail
—
1.5
Fail
3.4
AA Large
1.5
Fail
1.9
Fail
1.5
Fail
—
2.2
Fail
3.4
AA Large
4.3
AA Large
3.4
AA Large
2.2
Fail
—
White BG
1.5Fail
1.2Fail
1.5Fail
2.3Fail
5.0AA
Black BG
14.1AAA
18.0AAA
14.2AAA
9.3AAA
4.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

BABBBD
F2F2B6
E4E4A8
C5C4C2
707082

Deuteranopia

B6B0C0
F2F2BB
E6E9AB
CCD4BE
717180

Tritanopia

9EC7C9
F2C5C9
F3B2B4
EFB4B0
747C7B

Achromatopsia

C8C8C8
E9E9E9
D4D4D4
B1B1B1
717171

Shades & Tints Shades & Tints

#9AE4B0

Dark
Light

#F2F2A3

Dark
Light

#F5CE9C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9ae4b0;
  --color-2: #f2f2a3;
  --color-3: #f5ce9c;
  --color-4: #f488d5;
  --color-5: #746b89;
}

SCSS

$color-1: #9ae4b0;
$color-2: #f2f2a3;
$color-3: #f5ce9c;
$color-4: #f488d5;
$color-5: #746b89;

TAILWIND

colors: {
  'brand-1': '#9ae4b0',
  'brand-2': '#f2f2a3',
  'brand-3': '#f5ce9c',
  'brand-4': '#f488d5',
  'brand-5': '#746b89',
}

RGB Array

[154, 228, 176], [242, 242, 163], [245, 206, 156], [244, 136, 213], [116, 107, 137]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9AE4B0, #F2F2A3, #F5CE9C, #F488D5, #746B89 is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #9ae4b0; --color-2: #f2f2a3; --color-3: #f5ce9c; --color-4: #f488d5; --color-5: #746b89. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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