← Back to Editor

#C277C3 · #BAA0C8 · #B3BACC · #B2D0D0 · #C4D6CC

muted

A 5-color muted palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C277C3

Lilac · Orchid · Lilac Purple

HEX
#C277C3
RGB
rgb(194, 119, 195)
HSL
hsl(299, 39%, 62%)
HSB
hsb(299, 39%, 76%)
CMYK
cmyk(1%, 39%, 0%, 24%)
Oklch
oklch(67.6% 0.136 326.5)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

#BAA0C8

Lilac · Silver · Lilac Purple

HEX
#BAA0C8
RGB
rgb(186, 160, 200)
HSL
hsl(279, 27%, 71%)
HSB
hsb(279, 20%, 78%)
CMYK
cmyk(7%, 20%, 0%, 22%)
Oklch
oklch(74.2% 0.063 313.7)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

#B3BACC

Azure · Silver · Cobalt Blue

HEX
#B3BACC
RGB
rgb(179, 186, 204)
HSL
hsl(223, 20%, 75%)
HSB
hsb(223, 12%, 80%)
CMYK
cmyk(12%, 9%, 0%, 20%)
Oklch
oklch(78.9% 0.027 268.8)

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

#B2D0D0

Sky Blue · LightSteelBlue · Glacier Blue

HEX
#B2D0D0
RGB
rgb(178, 208, 208)
HSL
hsl(180, 24%, 76%)
HSB
hsb(180, 14%, 82%)
CMYK
cmyk(14%, 0%, 0%, 18%)
Oklch
oklch(83.6% 0.032 196.6)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

#C4D6CC

Celadon · LightGray · Apple Green

HEX
#C4D6CC
RGB
rgb(196, 214, 204)
HSL
hsl(147, 18%, 80%)
HSB
hsb(147, 8%, 84%)
CMYK
cmyk(8%, 0%, 5%, 16%)
Oklch
oklch(86.0% 0.024 161.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C277C3
7AC478

Analogous

9D78C4
C277C3
C4789F

Triadic

C277C3
C4C378
78C4C3

Split-Comp.

C277C3
9FC478
78C49D

Tetradic

C277C3
C49D78
7AC478
789FC4

Contrast Matrix WCAG 2.1 Contrast

C277C3
BAA0C8
B3BACC
B2D0D0
C4D6CC
—
1.3
Fail
1.6
Fail
1.9
Fail
2.1
Fail
1.3
Fail
—
1.2
Fail
1.4
Fail
1.5
Fail
1.6
Fail
1.2
Fail
—
1.2
Fail
1.3
Fail
1.9
Fail
1.4
Fail
1.2
Fail
—
1.1
Fail
2.1
Fail
1.5
Fail
1.3
Fail
1.1
Fail
—
White BG
3.1AA Large
2.3Fail
1.9Fail
1.6Fail
1.5Fail
Black BG
6.7AA
9.0AAA
10.8AAA
12.8AAA
13.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A2A1B1
AFAFBE
B6B6C8
BFBFD0
CCCCCE

Deuteranopia

A6ABAC
B0B2BC
B6B5C7
BDBBD0
CBC9CF

Tritanopia

BEA29F
B9B7B5
B3C4C3
B4D0D0
C5D0D1

Achromatopsia

969696
ACACAC
BABABA
C7C7C7
CFCFCF

Shades & Tints Shades & Tints

#C277C3

Dark
Light

#BAA0C8

Dark
Light

#B3BACC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c277c3;
  --color-2: #baa0c8;
  --color-3: #b3bacc;
  --color-4: #b2d0d0;
  --color-5: #c4d6cc;
}

SCSS

$color-1: #c277c3;
$color-2: #baa0c8;
$color-3: #b3bacc;
$color-4: #b2d0d0;
$color-5: #c4d6cc;

TAILWIND

colors: {
  'brand-1': '#c277c3',
  'brand-2': '#baa0c8',
  'brand-3': '#b3bacc',
  'brand-4': '#b2d0d0',
  'brand-5': '#c4d6cc',
}

RGB Array

[194, 119, 195], [186, 160, 200], [179, 186, 204], [178, 208, 208], [196, 214, 204]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This muted-style palette of #C277C3, #BAA0C8, #B3BACC, #B2D0D0, #C4D6CC is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #c277c3; --color-2: #baa0c8; --color-3: #b3bacc; --color-4: #b2d0d0; --color-5: #c4d6cc. 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 muted-style 5-color scheme is especially suited for beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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