#CC945F + #8C8C3A + #906069 + #484868 + #48304C - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#CC945F

Tangerine · DarkSalmon · Warm Sun

HEX

#CC945F

RGB

rgb(204, 148, 95)

HSL

hsl(29, 52%, 59%)

HSB

hsb(29, 53%, 80%)

CMYK

cmyk(0%, 27%, 53%, 20%)

Oklch

oklch(70.9% 0.097 63.6)

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

#8C8C3A

Autumn Sage · Olive · Honey Gold

HEX

#8C8C3A

RGB

rgb(140, 140, 58)

HSL

hsl(60, 41%, 39%)

HSB

hsb(60, 59%, 55%)

CMYK

cmyk(0%, 0%, 59%, 45%)

Oklch

oklch(62.3% 0.105 109.1)

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

#906069

Crimson · DimGray · Passion Red

HEX

#906069

RGB

rgb(144, 96, 105)

HSL

hsl(349, 20%, 47%)

HSB

hsb(349, 33%, 56%)

CMYK

cmyk(0%, 33%, 27%, 44%)

Oklch

oklch(54.3% 0.064 7.1)

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

#484868

Deep Indigo · DarkSlateGray · Prussian Blue

HEX

#484868

RGB

rgb(72, 72, 104)

HSL

hsl(240, 18%, 35%)

HSB

hsb(240, 31%, 41%)

CMYK

cmyk(31%, 31%, 0%, 59%)

Oklch

oklch(41.5% 0.053 283.8)

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

#48304C

Dark Plum · DarkSlateGray · Eggplant

HEX

#48304C

RGB

rgb(72, 48, 76)

HSL

hsl(291, 23%, 24%)

HSB

hsb(291, 37%, 30%)

CMYK

cmyk(5%, 37%, 0%, 70%)

Oklch

oklch(34.9% 0.057 321.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CC945F

6098CD

Analogous

CD6062

CC945F

CDCB60

Triadic

CC945F

60CD95

9560CD

Split-Comp.

CC945F

60CDCB

6062CD

Tetradic

CC945F

62CD60

6098CD

CB60CD

Contrast Matrix WCAG 2.1 Contrast

CC945F	8C8C3A	906069	484868	48304C
—	1.3 Fail	2.0 Fail	3.3 AA Large	4.4 AA Large
1.3 Fail	—	1.5 Fail	2.5 Fail	3.3 AA Large
2.0 Fail	1.5 Fail	—	1.7 Fail	2.3 Fail
3.3 AA Large	2.5 Fail	1.7 Fail	—	1.3 Fail
4.4 AA Large	3.3 AA Large	2.3 Fail	1.3 Fail	—

White BG

2.6Fail

3.5AA Large

5.2AA

8.7AAA

11.6AAA

Black BG

8.0AAA

5.9AA

4.1AA Large

2.4Fail

1.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B4B36C

8C8C4E

7B7B67

484860

3E3D45

Deuteranopia

B7BB6F

8C8C53

7E8266

48485E

3F4144

Tritanopia

C97678

8C5E61

8E6565

485A59

47403F

Achromatopsia

9F9F9F

838383

6F6F6F

4C4C4C

3A3A3A

Shades & Tints Shades & Tints

#CC945F

Dark

Light

#8C8C3A

Dark

Light

#906069

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cc945f;
  --color-2: #8c8c3a;
  --color-3: #906069;
  --color-4: #484868;
  --color-5: #48304c;
}

SCSS

$color-1: #cc945f;
$color-2: #8c8c3a;
$color-3: #906069;
$color-4: #484868;
$color-5: #48304c;

TAILWIND

colors: {
  'brand-1': '#cc945f',
  'brand-2': '#8c8c3a',
  'brand-3': '#906069',
  'brand-4': '#484868',
  'brand-5': '#48304c',
}

RGB Array

[204, 148, 95], [140, 140, 58], [144, 96, 105], [72, 72, 104], [72, 48, 76]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CC945F, #8C8C3A, #906069, #484868, #48304C 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: #cc945f; --color-2: #8c8c3a; --color-3: #906069; --color-4: #484868; --color-5: #48304c. 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 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