#3DCFC6 + #7DB2BD + #B486A1 + #CE5799 + #BC9992 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#3DCFC6

Mineral Blue · MediumTurquoise · Lake Green

HEX

#3DCFC6

RGB

rgb(61, 207, 198)

HSL

hsl(176, 60%, 53%)

HSB

hsb(176, 71%, 81%)

CMYK

cmyk(71%, 0%, 4%, 19%)

Oklch

oklch(77.7% 0.121 188.9)

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

#7DB2BD

Sky Blue · MediumAquaMarine · Lake Green

HEX

#7DB2BD

RGB

rgb(125, 178, 189)

HSL

hsl(190, 33%, 62%)

HSB

hsb(190, 34%, 74%)

CMYK

cmyk(34%, 6%, 0%, 26%)

Oklch

oklch(73.0% 0.058 212.0)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#B486A1

Mauve · DarkGray · Rose Pink

HEX

#B486A1

RGB

rgb(180, 134, 161)

HSL

hsl(325, 23%, 62%)

HSB

hsb(325, 26%, 71%)

CMYK

cmyk(0%, 26%, 11%, 29%)

Oklch

oklch(67.3% 0.067 343.0)

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

#CE5799

Rose Purple · LightCoral · Rose Pink

HEX

#CE5799

RGB

rgb(206, 87, 153)

HSL

hsl(327, 55%, 57%)

HSB

hsb(327, 58%, 81%)

CMYK

cmyk(0%, 58%, 26%, 19%)

Oklch

oklch(62.8% 0.167 348.6)

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

#BC9992

Peach Pink · DarkGray · Coral Red

HEX

#BC9992

RGB

rgb(188, 153, 146)

HSL

hsl(10, 24%, 65%)

HSB

hsb(10, 22%, 74%)

CMYK

cmyk(0%, 19%, 22%, 26%)

Oklch

oklch(71.3% 0.043 31.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3DCFC6

CF3F49

Analogous

3FCF7E

3DCFC6

3F91CF

Triadic

3DCFC6

C53FCF

CFC53F

Split-Comp.

3DCFC6

CF3F91

CF7E3F

Tetradic

3DCFC6

7E3FCF

CF3F49

91CF3F

Contrast Matrix WCAG 2.1 Contrast

3DCFC6	7DB2BD	B486A1	CE5799	BC9992
—	1.2 Fail	1.6 Fail	2.0 Fail	1.3 Fail
1.2 Fail	—	1.3 Fail	1.6 Fail	1.1 Fail
1.6 Fail	1.3 Fail	—	1.3 Fail	1.2 Fail
2.0 Fail	1.6 Fail	1.3 Fail	—	1.5 Fail
1.3 Fail	1.1 Fail	1.2 Fail	1.5 Fail	—

White BG

1.9Fail

2.3Fail

3.1AA Large

3.9AA Large

2.6Fail

Black BG

10.9AAA

9.0AAA

6.9AA

5.4AA

8.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7C7EC8

9494BA

A0A09A

9A9989

ADAD94

Deuteranopia

7469C9

918DBA

A3A699

A1AA85

AFB294

Tritanopia

44CACA

80B8B8

B29594

C87C7A

BA9595

Achromatopsia

A2A2A2

A3A3A3

979797

828282

A3A3A3

Shades & Tints Shades & Tints

#3DCFC6

Dark

Light

#7DB2BD

Dark

Light

#B486A1

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3dcfc6;
  --color-2: #7db2bd;
  --color-3: #b486a1;
  --color-4: #ce5799;
  --color-5: #bc9992;
}

SCSS

$color-1: #3dcfc6;
$color-2: #7db2bd;
$color-3: #b486a1;
$color-4: #ce5799;
$color-5: #bc9992;

TAILWIND

colors: {
  'brand-1': '#3dcfc6',
  'brand-2': '#7db2bd',
  'brand-3': '#b486a1',
  'brand-4': '#ce5799',
  'brand-5': '#bc9992',
}

RGB Array

[61, 207, 198], [125, 178, 189], [180, 134, 161], [206, 87, 153], [188, 153, 146]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3DCFC6, #7DB2BD, #B486A1, #CE5799, #BC9992 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: #3dcfc6; --color-2: #7db2bd; --color-3: #b486a1; --color-4: #ce5799; --color-5: #bc9992. 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