#C3DAD6 + #FCFD75 + #F7F905 + #C6B194 + #D1C0A8 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C3DAD6

Jade · LightGray · Glacier Blue

HEX

#C3DAD6

RGB

rgb(195, 218, 214)

HSL

hsl(170, 24%, 81%)

HSB

hsb(170, 11%, 85%)

CMYK

cmyk(11%, 0%, 2%, 15%)

Oklch

oklch(87.0% 0.025 184.2)

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

#FCFD75

Fresh Green · Khaki · Sunflower

HEX

#FCFD75

RGB

rgb(252, 253, 117)

HSL

hsl(60, 97%, 73%)

HSB

hsb(60, 54%, 99%)

CMYK

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

Oklch

oklch(96.7% 0.158 109.4)

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

#F7F905

Autumn Sage · Yellow · Honey Gold

HEX

#F7F905

RGB

rgb(247, 249, 5)

HSL

hsl(60, 96%, 50%)

HSB

hsb(60, 98%, 98%)

CMYK

cmyk(1%, 0%, 98%, 2%)

Oklch

oklch(94.9% 0.207 110.4)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#C6B194

Ginger · Tan · Warm Sun

HEX

#C6B194

RGB

rgb(198, 177, 148)

HSL

hsl(35, 30%, 68%)

HSB

hsb(35, 25%, 78%)

CMYK

cmyk(0%, 11%, 25%, 22%)

Oklch

oklch(77.1% 0.046 75.8)

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

#D1C0A8

Goose Yellow · Silver · Warm Sun

HEX

#D1C0A8

RGB

rgb(209, 192, 168)

HSL

hsl(35, 31%, 74%)

HSB

hsb(35, 20%, 82%)

CMYK

cmyk(0%, 8%, 20%, 18%)

Oklch

oklch(81.6% 0.038 76.6)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C3DAD6

DAC3C7

Analogous

C3DACB

C3DAD6

C3D2DA

Triadic

C3DAD6

D6C3DA

DAD6C3

Split-Comp.

C3DAD6

DAC3D2

DACBC3

Tetradic

C3DAD6

CBC3DA

DAC3C7

D2DAC3

Contrast Matrix WCAG 2.1 Contrast

C3DAD6	FCFD75	F7F905	C6B194	D1C0A8
—	1.4 Fail	1.3 Fail	1.4 Fail	1.2 Fail
1.4 Fail	—	1.1 Fail	1.9 Fail	1.6 Fail
1.3 Fail	1.1 Fail	—	1.8 Fail	1.6 Fail
1.4 Fail	1.9 Fail	1.8 Fail	—	1.2 Fail
1.2 Fail	1.6 Fail	1.6 Fail	1.2 Fail	—

White BG

1.5Fail

1.1Fail

2.1Fail

1.8Fail

Black BG

14.3AAA

19.4AAA

18.5AAA

10.1AAA

11.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CDCDD7

FCFC96

F8F840

BDBD9B

CAC9AE

Deuteranopia

CCCAD7

FCFC9E

F8F84E

BEC09D

CBCCAF

Tritanopia

C4D8D8

FCB0B6

F76F79

C5A1A2

D0B2B3

Achromatopsia

D3D3D3

EDEDED

DDDDDD

B4B4B4

C2C2C2

Shades & Tints Shades & Tints

#C3DAD6

Dark

Light

#FCFD75

Dark

Light

#F7F905

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c3dad6;
  --color-2: #fcfd75;
  --color-3: #f7f905;
  --color-4: #c6b194;
  --color-5: #d1c0a8;
}

SCSS

$color-1: #c3dad6;
$color-2: #fcfd75;
$color-3: #f7f905;
$color-4: #c6b194;
$color-5: #d1c0a8;

TAILWIND

colors: {
  'brand-1': '#c3dad6',
  'brand-2': '#fcfd75',
  'brand-3': '#f7f905',
  'brand-4': '#c6b194',
  'brand-5': '#d1c0a8',
}

RGB Array

[195, 218, 214], [252, 253, 117], [247, 249, 5], [198, 177, 148], [209, 192, 168]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C3DAD6, #FCFD75, #F7F905, #C6B194, #D1C0A8 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: #c3dad6; --color-2: #fcfd75; --color-3: #f7f905; --color-4: #c6b194; --color-5: #d1c0a8. 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