#C3C8A8 + #B1A968 + #CB7552 + #955263 + #505C68 · pastel - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarmCool

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#C3C8A8

Fresh Green · Silver · Sunflower

HEX

#C3C8A8

RGB

rgb(195, 200, 168)

HSL

hsl(69, 23%, 72%)

HSB

hsb(69, 16%, 78%)

CMYK

cmyk(3%, 0%, 16%, 22%)

Oklch

oklch(82.0% 0.044 114.6)

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

#B1A968

Autumn Sage · Tan · Sunflower

HEX

#B1A968

RGB

rgb(177, 169, 104)

HSL

hsl(53, 32%, 55%)

HSB

hsb(53, 41%, 69%)

CMYK

cmyk(0%, 5%, 41%, 31%)

Oklch

oklch(72.7% 0.086 102.2)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#CB7552

Tangerine · Coral · Warm Sun

HEX

#CB7552

RGB

rgb(203, 117, 82)

HSL

hsl(17, 54%, 56%)

HSB

hsb(17, 60%, 80%)

CMYK

cmyk(0%, 42%, 60%, 20%)

Oklch

oklch(65.0% 0.119 42.5)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#955263

Crimson · DimGray · Passion Red

HEX

#955263

RGB

rgb(149, 82, 99)

HSL

hsl(345, 29%, 45%)

HSB

hsb(345, 45%, 58%)

CMYK

cmyk(0%, 45%, 34%, 42%)

Oklch

oklch(52.2% 0.091 4.5)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#505C68

Indigo · DimGray · Prussian Blue

HEX

#505C68

RGB

rgb(80, 92, 104)

HSL

hsl(210, 13%, 36%)

HSB

hsb(210, 23%, 41%)

CMYK

cmyk(23%, 12%, 0%, 59%)

Oklch

oklch(46.9% 0.025 248.4)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C3C8A8

ACA7C8

Analogous

C8BDA7

C3C8A8

B3C8A7

Triadic

C3C8A8

A7C3C8

C8A7C3

Split-Comp.

C3C8A8

A7B3C8

BDA7C8

Tetradic

C3C8A8

A7C8BD

ACA7C8

C8A7B3

Contrast Matrix WCAG 2.1 Contrast

C3C8A8	B1A968	CB7552	955263	505C68
—	1.4 Fail	2.0 Fail	3.3 AA Large	4.0 AA Large
1.4 Fail	—	1.4 Fail	2.4 Fail	2.8 Fail
2.0 Fail	1.4 Fail	—	1.7 Fail	2.0 Fail
3.3 AA Large	2.4 Fail	1.7 Fail	—	1.2 Fail
4.0 AA Large	2.8 Fail	2.0 Fail	1.2 Fail	—

White BG

1.7Fail

2.4Fail

3.4AA Large

5.7AA

6.8AA

Black BG

12.1AAA

8.7AAA

6.2AA

3.7AA Large

3.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

C5C5B0

AEAD78

A6A55A

78775F

555565

Deuteranopia

C5C5B2

AEAF7C

ABB15D

7C815E

555464

Tritanopia

C3B6B7

B18487

C76163

925C5B

516362

Achromatopsia

C3C3C3

A4A4A4

8B8B8B

686868

5A5A5A

Shades & Tints Shades & Tints

#C3C8A8

Dark

Light

#B1A968

Dark

Light

#CB7552

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c3c8a8;
  --color-2: #b1a968;
  --color-3: #cb7552;
  --color-4: #955263;
  --color-5: #505c68;
}

SCSS

$color-1: #c3c8a8;
$color-2: #b1a968;
$color-3: #cb7552;
$color-4: #955263;
$color-5: #505c68;

TAILWIND

colors: {
  'brand-1': '#c3c8a8',
  'brand-2': '#b1a968',
  'brand-3': '#cb7552',
  'brand-4': '#955263',
  'brand-5': '#505c68',
}

RGB Array

[195, 200, 168], [177, 169, 104], [203, 117, 82], [149, 82, 99], [80, 92, 104]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #C3C8A8, #B1A968, #CB7552, #955263, #505C68 is ideal for: corporate websites, product showcases, portfolios. 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: #c3c8a8; --color-2: #b1a968; --color-3: #cb7552; --color-4: #955263; --color-5: #505c68. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 pastel-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