#D2D6BB + #64B9BC + #849C8C + #FD5E74 + #FBA49D - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D2D6BB

Fresh Green · LightGray · Lemon Cream

HEX

#D2D6BB

RGB

rgb(210, 214, 187)

HSL

hsl(69, 25%, 79%)

HSB

hsb(69, 13%, 84%)

CMYK

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

Oklch

oklch(86.6% 0.037 114.0)

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

#64B9BC

Slate Blue · MediumAquaMarine · Lake Green

HEX

#64B9BC

RGB

rgb(100, 185, 188)

HSL

hsl(182, 40%, 56%)

HSB

hsb(182, 47%, 74%)

CMYK

cmyk(47%, 2%, 0%, 26%)

Oklch

oklch(73.4% 0.083 198.5)

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

#849C8C

Celadon · LightSlateGray · Olive Green

HEX

#849C8C

RGB

rgb(132, 156, 140)

HSL

hsl(140, 11%, 56%)

HSB

hsb(140, 15%, 61%)

CMYK

cmyk(15%, 0%, 10%, 39%)

Oklch

oklch(66.9% 0.036 156.1)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#FD5E74

Peach Pink · Salmon · Coral Red

HEX

#FD5E74

RGB

rgb(253, 94, 116)

HSL

hsl(352, 98%, 68%)

HSB

hsb(352, 63%, 99%)

CMYK

cmyk(0%, 63%, 54%, 1%)

Oklch

oklch(69.5% 0.193 15.5)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#FBA49D

Peach Pink · LightSalmon · Coral Red

HEX

#FBA49D

RGB

rgb(251, 164, 157)

HSL

hsl(4, 92%, 80%)

HSB

hsb(4, 37%, 98%)

CMYK

cmyk(0%, 35%, 37%, 2%)

Oklch

oklch(80.3% 0.104 24.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D2D6BB

C0BCD7

Analogous

D7CDBC

D2D6BB

C5D7BC

Triadic

D2D6BB

BCD3D7

D7BCD3

Split-Comp.

D2D6BB

BCC5D7

CDBCD7

Tetradic

D2D6BB

BCD7CD

C0BCD7

D7BCC5

Contrast Matrix WCAG 2.1 Contrast

D2D6BB	64B9BC	849C8C	FD5E74	FBA49D
—	1.5 Fail	2.0 Fail	2.0 Fail	1.3 Fail
1.5 Fail	—	1.3 Fail	1.3 Fail	1.2 Fail
2.0 Fail	1.3 Fail	—	1.0 Fail	1.5 Fail
2.0 Fail	1.3 Fail	1.0 Fail	—	1.6 Fail
1.3 Fail	1.2 Fail	1.5 Fail	1.6 Fail	—

White BG

1.5Fail

2.3Fail

3.0Fail

1.9Fail

Black BG

14.1AAA

9.2AAA

7.1AAA

7.0AAA

10.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D4D4C2

898ABB

8E8F90

B8B76F

D5D59F

Deuteranopia

D4D3C3

847EBB

8D8B91

C1CD6D

DAE19F

Tritanopia

D2C7C8

68BBBB

859394

F56A6A

F7A0A0

Achromatopsia

D2D2D2

A0A0A0

939393

909090

BDBDBD

Shades & Tints Shades & Tints

#D2D6BB

Dark

Light

#64B9BC

Dark

Light

#849C8C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d2d6bb;
  --color-2: #64b9bc;
  --color-3: #849c8c;
  --color-4: #fd5e74;
  --color-5: #fba49d;
}

SCSS

$color-1: #d2d6bb;
$color-2: #64b9bc;
$color-3: #849c8c;
$color-4: #fd5e74;
$color-5: #fba49d;

TAILWIND

colors: {
  'brand-1': '#d2d6bb',
  'brand-2': '#64b9bc',
  'brand-3': '#849c8c',
  'brand-4': '#fd5e74',
  'brand-5': '#fba49d',
}

RGB Array

[210, 214, 187], [100, 185, 188], [132, 156, 140], [253, 94, 116], [251, 164, 157]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D2D6BB, #64B9BC, #849C8C, #FD5E74, #FBA49D 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: #d2d6bb; --color-2: #64b9bc; --color-3: #849c8c; --color-4: #fd5e74; --color-5: #fba49d. 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