PalettesRed Gradient

Palette

Red Gradient

Fiery reds flow into scarlet, painting a fierce, passionate gradient made to command attention.

Color analysis

Palette profile

This 10-color palette is warm-led with a vivid character and close tonal range. Its internal colors provide 0 pairs at or above the 4.5:1 contrast target for normal text.

Temperature

Warm-led

Color character

Vivid

Lightness span

27%

Accessible pairs

0 / 45

Colors

Red 641220#641220A defining swatch in this palette, useful for UI accents, branding systems, and visual direction.RGBrgb(100, 18, 32)HSLhsl(349.8, 69.5%, 23.1%)CMYKcmyk(0%, 82%, 68%, 60.8%)LABlab(21.01, 36.58, 13.91)

Red 6E1423#6E1423A defining swatch in this palette, useful for UI accents, branding systems, and visual direction.RGBrgb(110, 20, 35)HSLhsl(350, 69.2%, 25.5%)CMYKcmyk(0%, 81.8%, 68.2%, 56.9%)LABlab(23.46, 39.32, 15.43)

Red 85182A#85182AA defining swatch in this palette, useful for UI accents, branding systems, and visual direction.RGBrgb(133, 24, 42)HSLhsl(350.1, 69.4%, 30.8%)CMYKcmyk(0%, 82%, 68.4%, 47.8%)LABlab(28.92, 45.65, 18.69)

Red A11D33#A11D33A defining swatch in this palette, useful for UI accents, branding systems, and visual direction.RGBrgb(161, 29, 51)HSLhsl(350, 69.5%, 37.3%)CMYKcmyk(0%, 82%, 68.3%, 36.9%)LABlab(35.39, 53.02, 22.23)

Red A71E34#A71E34A defining swatch in this palette, useful for UI accents, branding systems, and visual direction.RGBrgb(167, 30, 52)HSLhsl(350.4, 69.5%, 38.6%)CMYKcmyk(0%, 82%, 68.9%, 34.5%)LABlab(36.73, 54.54, 23.53)

Red B21E35#B21E35A defining swatch in this palette, useful for UI accents, branding systems, and visual direction.RGBrgb(178, 30, 53)HSLhsl(350.7, 71.2%, 40.8%)CMYKcmyk(0%, 83.1%, 70.2%, 30.2%)LABlab(38.99, 57.71, 26.19)

Red BD1F36#BD1F36A defining swatch in this palette, useful for UI accents, branding systems, and visual direction.RGBrgb(189, 31, 54)HSLhsl(351.3, 71.8%, 43.1%)CMYKcmyk(0%, 83.6%, 71.4%, 25.9%)LABlab(41.33, 60.58, 28.91)

Red C71F37#C71F37A defining swatch in this palette, useful for UI accents, branding systems, and visual direction.RGBrgb(199, 31, 55)HSLhsl(351.4, 73%, 45.1%)CMYKcmyk(0%, 84.4%, 72.4%, 22%)LABlab(43.36, 63.35, 31.22)

Red DA1E37#DA1E37A defining swatch in this palette, useful for UI accents, branding systems, and visual direction.RGBrgb(218, 30, 55)HSLhsl(352, 75.8%, 48.6%)CMYKcmyk(0%, 86.2%, 74.8%, 14.5%)LABlab(47.12, 68.61, 36.55)

Red E01E37#E01E37A defining swatch in this palette, useful for UI accents, branding systems, and visual direction.RGBrgb(224, 30, 55)HSLhsl(352.3, 76.4%, 49.8%)CMYKcmyk(0%, 86.6%, 75.4%, 12.2%)LABlab(48.33, 70.17, 38.23)

Meaning

Summer

Psychology

EnergyIntensityInvigorationEnthusiasmFocusConsistency

Usage

Travel WebsitesSummer Campaigns

Red 641220

#641220

Black text

1.65:1Fail

White text

12.73:1AAA

Support

Red 6E1423

#6E1423

Black text

1.79:1Fail

White text

11.75:1AAA

Support

Red 85182A

#85182A

Black text

2.16:1Fail

White text

9.72:1AAA

Support

Red A11D33

#A11D33

Black text

2.74:1Fail

White text

7.67:1AAA

Support

Red A71E34

#A71E34

Black text

2.88:1Fail

White text

7.30:1AAA

Support

Red B21E35

#B21E35

Black text

3.13:1AA Large

White text

6.71:1AA

Support

Red BD1F36

#BD1F36

Black text

3.41:1AA Large

White text

6.15:1AA

Support

Red C71F37

#C71F37

Black text

3.68:1AA Large

White text

5.71:1AA

Support

Red DA1E37

#DA1E37

Black text

4.22:1AA Large

White text

4.97:1AA

Surface · Accent

Red E01E37

#E01E37

Black text

4.41:1AA Large

White text

4.76:1AA

Best internal combinations

The strongest foreground and background pairs found inside this palette.

No internal pair reaches 4.5:1. Use black or white text recommendations above, or add a darker or lighter supporting color.

Color vision previews

Approximate simulations help reveal swatches that may become difficult to distinguish.

Protanopia

Reduced sensitivity to red light.

Deuteranopia

Reduced sensitivity to green light.

Tritanopia

Reduced sensitivity to blue light.

Achromatopsia

A grayscale approximation without hue perception.

CSS variables

Copy this palette as reusable custom properties for a design system or prototype.

:root {
  --palette-1: #641220;
  --palette-2: #6E1423;
  --palette-3: #85182A;
  --palette-4: #A11D33;
  --palette-5: #A71E34;
  --palette-6: #B21E35;
  --palette-7: #BD1F36;
  --palette-8: #C71F37;
  --palette-9: #DA1E37;
  --palette-10: #E01E37;
}

Similar palettes

Related combinations keep loading automatically as you continue scrolling.

Cherry Blossom Bloom

Pink Ombre

Delicate Pastel Dreams

Fiery Orange Gradient

More palettes load automatically as you continue scrolling.