#766576 + #B375A7 + #4CCED2 + #88EDC5 + #EDCABA - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#766576

Rose Purple · DimGray · Warm Gray

HEX

#766576

RGB

rgb(118, 101, 118)

HSL

hsl(300, 8%, 43%)

HSB

hsb(300, 14%, 46%)

CMYK

cmyk(0%, 14%, 0%, 54%)

Oklch

oklch(52.9% 0.033 326.0)

Traditional「Rose Purple」· Paint「Warm Gray」· Creative Urban Concrete

#B375A7

Rose Purple · DarkGray · Violet

HEX

#B375A7

RGB

rgb(179, 117, 167)

HSL

hsl(312, 29%, 58%)

HSB

hsb(312, 35%, 70%)

CMYK

cmyk(0%, 35%, 7%, 30%)

Oklch

oklch(64.4% 0.102 333.9)

Traditional「Rose Purple」· Paint「Violet」· Creative Blush Sunrise

#4CCED2

Lake Blue · MediumTurquoise · Lake Green

HEX

#4CCED2

RGB

rgb(76, 206, 210)

HSL

hsl(182, 60%, 56%)

HSB

hsb(182, 64%, 82%)

CMYK

cmyk(64%, 2%, 0%, 18%)

Oklch

oklch(78.3% 0.112 198.0)

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

#88EDC5

Jade · SkyBlue · Apple Green

HEX

#88EDC5

RGB

rgb(136, 237, 197)

HSL

hsl(156, 74%, 73%)

HSB

hsb(156, 43%, 93%)

CMYK

cmyk(43%, 0%, 17%, 7%)

Oklch

oklch(87.3% 0.111 166.4)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#EDCABA

Apricot · Wheat · Peach Orange

HEX

#EDCABA

RGB

rgb(237, 202, 186)

HSL

hsl(19, 59%, 83%)

HSB

hsb(19, 22%, 93%)

CMYK

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

Oklch

oklch(86.5% 0.045 46.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

766576

657665

Analogous

6E6576

766576

76656E

Triadic

766576

767665

657676

Split-Comp.

766576

6E7665

65766E

Tetradic

766576

766E65

657665

656E76

Contrast Matrix WCAG 2.1 Contrast

766576	B375A7	4CCED2	88EDC5	EDCABA
—	1.5 Fail	2.8 Fail	3.8 AA Large	3.5 AA Large
1.5 Fail	—	1.8 Fail	2.5 Fail	2.3 Fail
2.8 Fail	1.8 Fail	—	1.4 Fail	1.2 Fail
3.8 AA Large	2.5 Fail	1.4 Fail	—	1.1 Fail
3.5 AA Large	2.3 Fail	1.2 Fail	1.1 Fail	—

White BG

5.4AA

3.5AA Large

1.9Fail

1.4Fail

1.5Fail

Black BG

3.9AA Large

6.0AA

11.1AAA

15.0AAA

13.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6F6E72

98989B

8485D1

B4B5CF

DEDEBE

Deuteranopia

707171

9CA098

7D73D1

AEA6D1

E0E2BF

Tritanopia

756F6E

B0918F

53D0D0

8DD6D8

EBC1C2

Achromatopsia

6C6C6C

8D8D8D

A8A8A8

CACACA

D3D3D3

Shades & Tints Shades & Tints

#766576

Dark

Light

#B375A7

Dark

Light

#4CCED2

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #766576;
  --color-2: #b375a7;
  --color-3: #4cced2;
  --color-4: #88edc5;
  --color-5: #edcaba;
}

SCSS

$color-1: #766576;
$color-2: #b375a7;
$color-3: #4cced2;
$color-4: #88edc5;
$color-5: #edcaba;

TAILWIND

colors: {
  'brand-1': '#766576',
  'brand-2': '#b375a7',
  'brand-3': '#4cced2',
  'brand-4': '#88edc5',
  'brand-5': '#edcaba',
}

RGB Array

[118, 101, 118], [179, 117, 167], [76, 206, 210], [136, 237, 197], [237, 202, 186]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #766576, #B375A7, #4CCED2, #88EDC5, #EDCABA 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: #766576; --color-2: #b375a7; --color-3: #4cced2; --color-4: #88edc5; --color-5: #edcaba. 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 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