← Back to Editor

#CCCC80 · #E66640 · #F33320 · #CC0000 · #990000

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#CCCC80

Fresh Green · Tan · Sunflower

HEX
#CCCC80
RGB
rgb(204, 204, 128)
HSL
hsl(60, 43%, 65%)
HSB
hsb(60, 37%, 80%)
CMYK
cmyk(0%, 0%, 37%, 20%)
Oklch
oklch(82.8% 0.098 108.4)

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

#E66640

Vermilion · Tomato · Passion Red

HEX
#E66640
RGB
rgb(230, 102, 64)
HSL
hsl(14, 77%, 58%)
HSB
hsb(14, 72%, 90%)
CMYK
cmyk(0%, 56%, 72%, 10%)
Oklch
oklch(66.2% 0.168 37.1)

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

#F33320

Vermilion · OrangeRed · Passion Red

HEX
#F33320
RGB
rgb(243, 51, 32)
HSL
hsl(5, 90%, 54%)
HSB
hsb(5, 87%, 95%)
CMYK
cmyk(0%, 79%, 87%, 5%)
Oklch
oklch(62.6% 0.228 30.2)

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

#CC0000

Vermilion · Red · Wine Red

HEX
#CC0000
RGB
rgb(204, 0, 0)
HSL
hsl(0, 100%, 40%)
HSB
hsb(0, 100%, 80%)
CMYK
cmyk(0%, 100%, 100%, 20%)
Oklch
oklch(53.1% 0.218 29.2)

Traditional「Vermilion」· Paint「Wine Red」· Creative Blush Sunrise

#990000

Vermilion · DarkRed · Wine Red

HEX
#990000
RGB
rgb(153, 0, 0)
HSL
hsl(0, 100%, 30%)
HSB
hsb(0, 100%, 60%)
CMYK
cmyk(0%, 100%, 100%, 40%)
Oklch
oklch(42.9% 0.176 29.2)

Traditional「Vermilion」· Paint「Wine Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CCCC80
7F7FCC

Analogous

CCA67F
CCCC80
A6CC7F

Triadic

CCCC80
7FCCCC
CC7FCC

Split-Comp.

CCCC80
7FA6CC
A67FCC

Tetradic

CCCC80
7FCCA6
7F7FCC
CC7FA6

Contrast Matrix WCAG 2.1 Contrast

CCCC80
E66640
F33320
CC0000
990000
—
2.0
Fail
2.4
Fail
3.5
AA Large
5.3
AA
2.0
Fail
—
1.2
Fail
1.8
Fail
2.7
Fail
2.4
Fail
1.2
Fail
—
1.5
Fail
2.3
Fail
3.5
AA Large
1.8
Fail
1.5
Fail
—
1.5
Fail
5.3
AA
2.7
Fail
2.3
Fail
1.5
Fail
—
White BG
1.7Fail
3.3AA Large
4.0AA Large
5.9AA
8.9AAA
Black BG
12.5AAA
6.3AA
5.3AA
3.6AA Large
2.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

CCCC92
AFAD49
A09E25
747200
575500

Deuteranopia

CCCC97
B6C04B
ABB926
808F00
606B00

Tritanopia

CCA1A4
E05052
E92829
C20000
910000

Achromatopsia

C3C3C3
888888
6A6A6A
3D3D3D
2E2E2E

Shades & Tints Shades & Tints

#CCCC80

Dark
Light

#E66640

Dark
Light

#F33320

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cccc80;
  --color-2: #e66640;
  --color-3: #f33320;
  --color-4: #cc0000;
  --color-5: #990000;
}

SCSS

$color-1: #cccc80;
$color-2: #e66640;
$color-3: #f33320;
$color-4: #cc0000;
$color-5: #990000;

TAILWIND

colors: {
  'brand-1': '#cccc80',
  'brand-2': '#e66640',
  'brand-3': '#f33320',
  'brand-4': '#cc0000',
  'brand-5': '#990000',
}

RGB Array

[204, 204, 128], [230, 102, 64], [243, 51, 32], [204, 0, 0], [153, 0, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CCCC80, #E66640, #F33320, #CC0000, #990000 is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #cccc80; --color-2: #e66640; --color-3: #f33320; --color-4: #cc0000; --color-5: #990000. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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