Red Color Palette: 6 Bold Shades & Schemes with Hex Codes

Red is the boldest colour in the spectrum — energetic, passionate, and impossible to ignore. A strong red color palette can feel exciting and urgent or rich and luxurious, depending on the shade. Red drives action, which is why it dominates sales, food, sports, and entertainment branding. This guide gives you six red palettes with hex codes and tips for using such a powerful colour.

Want colours that pair with red rather than shades of it? See what colours go with red. Otherwise, grab a palette below or browse the PaletteCSS library.

What red communicates

Red is the colour of energy, passion, urgency, and appetite. It physically grabs attention faster than any other hue, which makes it perfect for calls to action, sales, and warnings — but also means it should be used with intention. Bright reds feel urgent and exciting; deep reds like wine and burgundy feel sophisticated and luxurious; warm reds like coral feel friendly and approachable.

The red family ranges across:

• Classic and crimson red — bold, energetic, and confident.
• Coral and salmon — warm, soft, and friendly.
• Cherry and rose — vibrant with a pink lean.
• Brick and wine — deep, earthy, and premium.

6 red color palettes (with hex codes)

1. Classic Red

The dependable, energetic red scale.

#FFE5E5 · #FF9B9B · #FF4D4D · #D32F2F · #7F1D1D

2. Crimson

Deep and dramatic with a cool edge.

#FDE2E4 · #F8A5B0 · #E63956 · #B01030 · #5C0A1E

3. Coral Red

Warm and friendly, less intense.

#FFE8E0 · #FFB3A0 · #FF6F61 · #D9472F · #8C2A1E

4. Cherry

Vibrant red with a pink-leaning glow.

#FCE4EC · #F48FB1 · #E91E63 · #AD1457 · #560A2A

5. Brick Red

Earthy and muted for a grounded feel.

#F5E1DC · #D9A294 · #B5654D · #8A3324 · #4A1A12

6. Wine

Deep, rich, and luxurious.

#F3E0E4 · #C98A9B · #9B2242 · #6A1530 · #3A0A1C

How to use a red palette in CSS

:root {
  --red-50:  #FFE5E5;
  --red-200: #FF9B9B;
  --red-400: #FF4D4D;
  --red-600: #D32F2F;
  --red-900: #7F1D1D;
}

.button { background: var(--red-600); color: #fff; }

A bold red gradient makes a high-energy banner:

.hero {
  background: linear-gradient(135deg, #FF4D4D 0%, #7F1D1D 100%);
}

Tips for designing with red

• Use it sparingly. Red is loudest as an accent — for buttons, alerts, and highlights.
• Balance with neutrals. White, cream, grey, and charcoal calm red down.
• Choose the right shade. Bright red for urgency, wine for luxury, coral for friendliness.
• Test contrast. Red text can be hard to read; ensure it passes contrast against the background.

Frequently asked questions

What is a good red hex code?

A versatile red is #D32F2F; for a brighter pop try #FF4D4D, and for a deep luxurious red use wine #6A1530.

What does red represent?

Red represents energy, passion, urgency, and appetite. It grabs attention quickly, making it ideal for calls to action, sales, and food brands.

What colors go with red?

Red pairs well with white, cream, navy, charcoal, and gold. See our full guide on what colours go with red for specific combinations.

Want more? Browse color palettes, read what colours go with red, or build a red gradient and copy the CSS.