Magenta-pink
HEX: #CC338B | Modern Palette
Color Specifications
#CC338B
204, 51, 139
325°, 75% ,80%
0, 75, 31.86, 20
About Magenta-pink
Magenta-pink (#CC338B) is a color with RGB(204, 51, 139) and HSL(325.49°, 75%, 80%). It is commonly associated with Playful, Romantic moods. In design, it fits Warm styles and is suitable for Text, Button, Background. Its complementary color is #33CC74, which creates strong contrast. Its triadic palette includes #8BCC33 and #338BCC. The name comes from Magenta-pink (English (descriptive compound)).
- HEX: #CC338B
- RGB: 204, 51, 139
- HSL: 325.49°, 75%, 80%
- Mood: Playful, Romantic
- Style: Warm
- Use case: Text, Button, Background
- Complementary color: #33CC74
- Triadic colors: #8BCC33, #338BCC
- The name comes from Magenta-pink (English (descriptive compound)).
Live Components
Color Palettes
Color Harmonies
Complementary
The color directly opposite on the color wheel — creates maximum contrast and vibrance.
Analogous
Colors adjacent on the wheel — naturally harmonious and pleasing to the eye.
Triadic
Three colors equally spaced 120° apart — bold, balanced, and visually rich.
Split-Complementary
Two colors flanking the complement — high contrast with less tension than full complementary.
Tetradic (Square)
Four colors at 90° intervals — rich variety, best when one color dominates.
Monochromatic
Shades and tints of the same hue — cohesive, elegant, and easy to work with.
Shades & Tints
A seamless scale of #CC338B from deepest shade to lightest tint.
Frequently Asked Questions
Name, History & Etymology
History
Magenta itself was named after the Battle of Magenta in 1859, coinciding with the discovery of the fuchsine dye that produced this color. Pink has a much older history, deriving from the flower. The compound 'magenta-pink' represents a common linguistic strategy to describe intermediate or blended colors by combining two known color terms. It serves to differentiate it from a pure magenta (which can be more purplish-red) and a pure pink (which is typically lighter and less saturated). The specific hex code #cc338b places it firmly in this blended territory, being a vibrant, deep pink with strong magenta undertones.
First Recorded Use
While 'magenta' and 'pink' have older origins, the compound 'magenta-pink' as a precise color descriptor likely emerged as color naming became more nuanced, particularly with the advent of synthetic dyes and more precise color classification in fashion, art, and printing. Specific documented first uses are hard to pinpoint for such descriptive compounds, but its usage would have solidified in the late 19th to early 20th century.
Cultural Associations
This color, like magenta and pink, often carries associations of vibrancy, femininity, playfulness, and sometimes boldness. It's frequently seen in fashion, cosmetics, and design where a striking yet approachable color is desired. It can evoke feelings of romance, energy, and creativity. In some contexts, it might be associated with 'girly' aesthetics, but its depth also allows for more sophisticated applications.
Code Snippets
/* Background */
.element {
background-color: #CC338B;
}
/* Text */
.element {
color: #CC338B;
}
/* Border */
.element {
border: 1px solid #CC338B;
}/* Linear gradient to complementary */
.element {
background: linear-gradient(
to right,
#CC338B,
#A6F2C6
);
}
/* Radial gradient */
.element {
background: radial-gradient(
circle,
#CC338B,
#A6F2C6
);
}// SCSS variable
$magenta-pink: #CC338B;
// With RGB channels (useful for rgba() usage)
$magenta-pink-r: 204;
$magenta-pink-g: 51;
$magenta-pink-b: 139;
// Usage
.element {
background-color: $magenta-pink;
color: rgba($magenta-pink-r, $magenta-pink-g, $magenta-pink-b, 0.8);
}