← Back to Editor

#472E4B · #A7BAC1 · #C1DADF · #E4F1EA · #D09DBE

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#472E4B

Dark Plum · DarkSlateGray · Eggplant

HEX
#472E4B
RGB
rgb(71, 46, 75)
HSL
hsl(292, 24%, 24%)
HSB
hsb(292, 39%, 29%)
CMYK
cmyk(5%, 39%, 0%, 71%)
Oklch
oklch(34.3% 0.059 321.8)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#A7BAC1

Sky Blue · Silver · Lake Green

HEX
#A7BAC1
RGB
rgb(167, 186, 193)
HSL
hsl(196, 17%, 71%)
HSB
hsb(196, 13%, 76%)
CMYK
cmyk(13%, 4%, 0%, 24%)
Oklch
oklch(77.7% 0.023 221.9)

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

#C1DADF

Sky Blue · LightBlue · Glacier Blue

HEX
#C1DADF
RGB
rgb(193, 218, 223)
HSL
hsl(190, 32%, 82%)
HSB
hsb(190, 13%, 87%)
CMYK
cmyk(13%, 2%, 0%, 13%)
Oklch
oklch(87.1% 0.028 211.1)

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

#E4F1EA

Celadon · Lavender · Mint Green

HEX
#E4F1EA
RGB
rgb(228, 241, 234)
HSL
hsl(148, 32%, 92%)
HSB
hsb(148, 5%, 95%)
CMYK
cmyk(5%, 0%, 3%, 5%)
Oklch
oklch(94.6% 0.017 162.7)

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

#D09DBE

Mauve · Silver · Rose Pink

HEX
#D09DBE
RGB
rgb(208, 157, 190)
HSL
hsl(321, 35%, 72%)
HSB
hsb(321, 25%, 82%)
CMYK
cmyk(0%, 25%, 9%, 18%)
Oklch
oklch(75.4% 0.075 340.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

472E4B
324C2F

Analogous

392F4C
472E4B
4C2F41

Triadic

472E4B
4C482F
2F4C48

Split-Comp.

472E4B
414C2F
2F4C39

Tetradic

472E4B
4C392F
324C2F
2F414C

Contrast Matrix WCAG 2.1 Contrast

472E4B
A7BAC1
C1DADF
E4F1EA
D09DBE
—
5.9
AA
8.2
AAA
10.3
AAA
5.3
AA
5.9
AA
—
1.4
Fail
1.7
Fail
1.1
Fail
8.2
AAA
1.4
Fail
—
1.3
Fail
1.6
Fail
10.3
AAA
1.7
Fail
1.3
Fail
—
2.0
Fail
5.3
AA
1.1
Fail
1.6
Fail
2.0
Fail
—
White BG
11.9AAA
2.0Fail
1.5Fail
1.2Fail
2.3Fail
Black BG
1.8Fail
10.4AAA
14.4AAA
18.1AAA
9.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3C3C44
AFAFBF
CCCCDE
EAEAEC
BAB9B6

Deuteranopia

3E3F42
AEADBF
CAC9DE
E9E8EC
BDC1B4

Tritanopia

463E3D
A8BEBE
C2DDDD
E5EDED
CDB0AE

Achromatopsia

393939
B5B5B5
D3D3D3
ECECEC
B0B0B0

Shades & Tints Shades & Tints

#472E4B

Dark
Light

#A7BAC1

Dark
Light

#C1DADF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #472e4b;
  --color-2: #a7bac1;
  --color-3: #c1dadf;
  --color-4: #e4f1ea;
  --color-5: #d09dbe;
}

SCSS

$color-1: #472e4b;
$color-2: #a7bac1;
$color-3: #c1dadf;
$color-4: #e4f1ea;
$color-5: #d09dbe;

TAILWIND

colors: {
  'brand-1': '#472e4b',
  'brand-2': '#a7bac1',
  'brand-3': '#c1dadf',
  'brand-4': '#e4f1ea',
  'brand-5': '#d09dbe',
}

RGB Array

[71, 46, 75], [167, 186, 193], [193, 218, 223], [228, 241, 234], [208, 157, 190]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #472E4B, #A7BAC1, #C1DADF, #E4F1EA, #D09DBE is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #472e4b; --color-2: #a7bac1; --color-3: #c1dadf; --color-4: #e4f1ea; --color-5: #d09dbe. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 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