#C4A1DE + #A1D4DE + #C4DEA1 + #DDA573 + #DDD473 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C4A1DE

Lilac · LightSteelBlue · Lilac Purple

HEX

#C4A1DE

RGB

rgb(196, 161, 222)

HSL

hsl(274, 48%, 75%)

HSB

hsb(274, 27%, 87%)

CMYK

cmyk(12%, 27%, 0%, 13%)

Oklch

oklch(76.1% 0.093 310.3)

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

#A1D4DE

Sky Blue · LightBlue · Lake Green

HEX

#A1D4DE

RGB

rgb(161, 212, 222)

HSL

hsl(190, 48%, 75%)

HSB

hsb(190, 27%, 87%)

CMYK

cmyk(27%, 5%, 0%, 13%)

Oklch

oklch(83.8% 0.055 211.0)

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

#C4DEA1

Willow Green · Silver · Apple Green

HEX

#C4DEA1

RGB

rgb(196, 222, 161)

HSL

hsl(86, 48%, 75%)

HSB

hsb(86, 27%, 87%)

CMYK

cmyk(12%, 0%, 27%, 13%)

Oklch

oklch(86.6% 0.086 126.9)

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

#DDA573

Apricot · DarkSalmon · Warm Sun

HEX

#DDA573

RGB

rgb(221, 165, 115)

HSL

hsl(28, 61%, 66%)

HSB

hsb(28, 48%, 87%)

CMYK

cmyk(0%, 25%, 48%, 13%)

Oklch

oklch(76.3% 0.093 62.5)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#DDD473

Fresh Green · BurlyWood · Sunflower

HEX

#DDD473

RGB

rgb(221, 212, 115)

HSL

hsl(55, 61%, 66%)

HSB

hsb(55, 48%, 87%)

CMYK

cmyk(0%, 4%, 48%, 13%)

Oklch

oklch(85.7% 0.120 103.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C4A1DE

BBDEA1

Analogous

A5A1DE

C4A1DE

DEA1DA

Triadic

C4A1DE

DEC3A1

A1DEC3

Split-Comp.

C4A1DE

DADEA1

A1DEA5

Tetradic

C4A1DE

DEA5A1

BBDEA1

A1DADE

Contrast Matrix WCAG 2.1 Contrast

C4A1DE	A1D4DE	C4DEA1	DDA573	DDD473
—	1.4 Fail	1.5 Fail	1.0 Fail	1.4 Fail
1.4 Fail	—	1.1 Fail	1.3 Fail	1.1 Fail
1.5 Fail	1.1 Fail	—	1.5 Fail	1.0 Fail
1.0 Fail	1.3 Fail	1.5 Fail	—	1.4 Fail
1.4 Fail	1.1 Fail	1.0 Fail	1.4 Fail	—

White BG

2.2Fail

1.6Fail

1.5Fail

2.2Fail

1.5Fail

Black BG

9.5AAA

13.0AAA

14.3AAA

9.7AAA

13.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B5B5CF

B7B8DC

CFCFB0

C5C47F

D9D98A

Deuteranopia

B7BACC

B4B0DB

CECCB3

C8CC82

DADA90

Tritanopia

C2C4C1

A4DAD9

C5BBBE

DA898B

DD9DA1

Achromatopsia

B2B2B2

C6C6C6

CFCFCF

B0B0B0

CCCCCC

Shades & Tints Shades & Tints

#C4A1DE

Dark

Light

#A1D4DE

Dark

Light

#C4DEA1

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c4a1de;
  --color-2: #a1d4de;
  --color-3: #c4dea1;
  --color-4: #dda573;
  --color-5: #ddd473;
}

SCSS

$color-1: #c4a1de;
$color-2: #a1d4de;
$color-3: #c4dea1;
$color-4: #dda573;
$color-5: #ddd473;

TAILWIND

colors: {
  'brand-1': '#c4a1de',
  'brand-2': '#a1d4de',
  'brand-3': '#c4dea1',
  'brand-4': '#dda573',
  'brand-5': '#ddd473',
}

RGB Array

[196, 161, 222], [161, 212, 222], [196, 222, 161], [221, 165, 115], [221, 212, 115]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C4A1DE, #A1D4DE, #C4DEA1, #DDA573, #DDD473 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: #c4a1de; --color-2: #a1d4de; --color-3: #c4dea1; --color-4: #dda573; --color-5: #ddd473. 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