#83BBC3 + #DB7AB4 + #D1A5BB + #D3CEBD + #E2E6C1 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#83BBC3

Sky Blue · MediumAquaMarine · Lake Green

HEX

#83BBC3

RGB

rgb(131, 187, 195)

HSL

hsl(188, 35%, 64%)

HSB

hsb(188, 33%, 76%)

CMYK

cmyk(33%, 4%, 0%, 24%)

Oklch

oklch(75.6% 0.059 207.1)

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

#DB7AB4

Mauve · Orchid · Rose Pink

HEX

#DB7AB4

RGB

rgb(219, 122, 180)

HSL

hsl(324, 57%, 67%)

HSB

hsb(324, 44%, 86%)

CMYK

cmyk(0%, 44%, 18%, 14%)

Oklch

oklch(70.4% 0.139 344.5)

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

#D1A5BB

Rouge · Silver · Rose Pink

HEX

#D1A5BB

RGB

rgb(209, 165, 187)

HSL

hsl(330, 32%, 73%)

HSB

hsb(330, 21%, 82%)

CMYK

cmyk(0%, 21%, 11%, 18%)

Oklch

oklch(76.8% 0.059 347.1)

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

#D3CEBD

Goose Yellow · LightGray · Lemon Cream

HEX

#D3CEBD

RGB

rgb(211, 206, 189)

HSL

hsl(46, 20%, 78%)

HSB

hsb(46, 10%, 83%)

CMYK

cmyk(0%, 2%, 10%, 17%)

Oklch

oklch(85.1% 0.024 93.4)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#E2E6C1

Fresh Green · Wheat · Lemon Cream

HEX

#E2E6C1

RGB

rgb(226, 230, 193)

HSL

hsl(66, 43%, 83%)

HSB

hsb(66, 16%, 90%)

CMYK

cmyk(2%, 0%, 16%, 10%)

Oklch

oklch(91.2% 0.049 112.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

83BBC3

C38C83

Analogous

83C3AC

83BBC3

839BC3

Triadic

83BBC3

C383BB

BBC383

Split-Comp.

83BBC3

C3839B

C3AC83

Tetradic

83BBC3

AC83C3

C38C83

9BC383

Contrast Matrix WCAG 2.1 Contrast

83BBC3	DB7AB4	D1A5BB	D3CEBD	E2E6C1
—	1.3 Fail	1.0 Fail	1.4 Fail	1.7 Fail
1.3 Fail	—	1.3 Fail	1.8 Fail	2.2 Fail
1.0 Fail	1.3 Fail	—	1.4 Fail	1.7 Fail
1.4 Fail	1.8 Fail	1.4 Fail	—	1.2 Fail
1.7 Fail	2.2 Fail	1.7 Fail	1.2 Fail	—

White BG

2.1Fail

2.8Fail

2.1Fail

1.6Fail

1.3Fail

Black BG

9.9AAA

7.5AAA

9.8AAA

13.3AAA

16.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9B9CC1

B1B0A6

BEBEB6

D1D1C1

E4E4CA

Deuteranopia

9894C1

B7BEA3

C1C4B4

D1D2C2

E4E3CC

Tritanopia

86C0BF

D69B98

CFB1B1

D3C4C5

E2D1D3

Achromatopsia

ABABAB

9E9E9E

B5B5B5

CECECE

E1E1E1

Shades & Tints Shades & Tints

#83BBC3

Dark

Light

#DB7AB4

Dark

Light

#D1A5BB

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #83bbc3;
  --color-2: #db7ab4;
  --color-3: #d1a5bb;
  --color-4: #d3cebd;
  --color-5: #e2e6c1;
}

SCSS

$color-1: #83bbc3;
$color-2: #db7ab4;
$color-3: #d1a5bb;
$color-4: #d3cebd;
$color-5: #e2e6c1;

TAILWIND

colors: {
  'brand-1': '#83bbc3',
  'brand-2': '#db7ab4',
  'brand-3': '#d1a5bb',
  'brand-4': '#d3cebd',
  'brand-5': '#e2e6c1',
}

RGB Array

[131, 187, 195], [219, 122, 180], [209, 165, 187], [211, 206, 189], [226, 230, 193]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #83BBC3, #DB7AB4, #D1A5BB, #D3CEBD, #E2E6C1 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: #83bbc3; --color-2: #db7ab4; --color-3: #d1a5bb; --color-4: #d3cebd; --color-5: #e2e6c1. 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