#AE9BA3 + #5BE89D + #48D1A4 + #789CCB + #E55BD2 · bright - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#AE9BA3

Rouge · DarkGray · Rose Pink

HEX

#AE9BA3

RGB

rgb(174, 155, 163)

HSL

hsl(335, 10%, 65%)

HSB

hsb(335, 11%, 68%)

CMYK

cmyk(0%, 11%, 6%, 32%)

Oklch

oklch(70.8% 0.025 350.4)

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

#5BE89D

Emerald · MediumAquaMarine · Apple Green

HEX

#5BE89D

RGB

rgb(91, 232, 157)

HSL

hsl(148, 75%, 63%)

HSB

hsb(148, 61%, 91%)

CMYK

cmyk(61%, 0%, 32%, 9%)

Oklch

oklch(83.5% 0.162 156.7)

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

#48D1A4

Mineral Blue · MediumAquaMarine · Lake Green

HEX

#48D1A4

RGB

rgb(72, 209, 164)

HSL

hsl(160, 60%, 55%)

HSB

hsb(160, 66%, 82%)

CMYK

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

Oklch

oklch(77.5% 0.135 167.3)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#789CCB

Azure · CornflowerBlue · Cobalt Blue

HEX

#789CCB

RGB

rgb(120, 156, 203)

HSL

hsl(214, 44%, 63%)

HSB

hsb(214, 41%, 80%)

CMYK

cmyk(41%, 23%, 0%, 20%)

Oklch

oklch(68.4% 0.080 255.3)

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

#E55BD2

Mauve · Orchid · Lilac Purple

HEX

#E55BD2

RGB

rgb(229, 91, 210)

HSL

hsl(308, 73%, 63%)

HSB

hsb(308, 60%, 90%)

CMYK

cmyk(0%, 60%, 8%, 10%)

Oklch

oklch(68.8% 0.216 333.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AE9BA3

9DAFA7

Analogous

AF9DAD

AE9BA3

AF9E9D

Triadic

AE9BA3

A4AF9D

9DA4AF

Split-Comp.

AE9BA3

9DAF9E

9DADAF

Tetradic

AE9BA3

ADAF9D

9DAFA7

9E9DAF

Contrast Matrix WCAG 2.1 Contrast

AE9BA3	5BE89D	48D1A4	789CCB	E55BD2
—	1.7 Fail	1.4 Fail	1.1 Fail	1.2 Fail
1.7 Fail	—	1.2 Fail	1.8 Fail	2.0 Fail
1.4 Fail	1.2 Fail	—	1.5 Fail	1.6 Fail
1.1 Fail	1.8 Fail	1.5 Fail	—	1.1 Fail
1.2 Fail	2.0 Fail	1.6 Fail	1.1 Fail	—

White BG

2.6Fail

1.6Fail

1.9Fail

2.8Fail

3.1AA Large

Black BG

8.0AAA

13.5AAA

10.9AAA

7.4AAA

6.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A6A6A1

9899AF

8385AF

8888C0

A9A8B5

Deuteranopia

A7A8A1

9085B4

7B71B2

8683BD

B1BCAE

Tritanopia

ADA09F

62BDC1

4FB7B9

7AB7B5

DE9E99

Achromatopsia

A2A2A2

B5B5B5

A3A3A3

979797

929292

Shades & Tints Shades & Tints

#AE9BA3

Dark

Light

#5BE89D

Dark

Light

#48D1A4

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ae9ba3;
  --color-2: #5be89d;
  --color-3: #48d1a4;
  --color-4: #789ccb;
  --color-5: #e55bd2;
}

SCSS

$color-1: #ae9ba3;
$color-2: #5be89d;
$color-3: #48d1a4;
$color-4: #789ccb;
$color-5: #e55bd2;

TAILWIND

colors: {
  'brand-1': '#ae9ba3',
  'brand-2': '#5be89d',
  'brand-3': '#48d1a4',
  'brand-4': '#789ccb',
  'brand-5': '#e55bd2',
}

RGB Array

[174, 155, 163], [91, 232, 157], [72, 209, 164], [120, 156, 203], [229, 91, 210]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #AE9BA3, #5BE89D, #48D1A4, #789CCB, #E55BD2 is ideal for: corporate websites, product showcases, portfolios. 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: #ae9ba3; --color-2: #5be89d; --color-3: #48d1a4; --color-4: #789ccb; --color-5: #e55bd2. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 bright-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