Fuchsia Rose

HEX: #C74375 | Modern Palette

On White
4.68:1
PASS
On Black
4.49:1
FAIL

Color Specifications

HEX
#C74375
RGB
199, 67, 117
HSL
337°, 66% ,78%
CMYK
0, 66.33, 41.21, 21.96

About Fuchsia Rose

Fuchsia Rose (#C74375) is a color with RGB(199, 67, 117) and HSL(337.27°, 66.33%, 78.04%). It is commonly associated with Playful, Romantic moods. In design, it fits Warm styles and is suitable for Text, Button, Accent. Its complementary color is #43C795, which creates strong contrast. Its triadic palette includes #75C743 and #4375C7. The name comes from Fuchsia Rose (English).

  • HEX: #C74375
  • RGB: 199, 67, 117
  • HSL: 337.27°, 66.33%, 78.04%
  • Mood: Playful, Romantic
  • Style: Warm
  • Use case: Text, Button, Accent
  • Complementary color: #43C795
  • Triadic colors: #75C743, #4375C7
  • The name comes from Fuchsia Rose (English).

Live Components

LIGHT
DARK
System Notification Box

Color Palettes

Monochromatic Five tones of the same hue — a reliable scale for backgrounds, surfaces, and text.
Neutral + Accent Four near-neutral tones grounded by a saturated accent — clean and versatile for UI.
Analogous Five hues drifting across a 60° arc — naturally harmonious and pleasing to the eye.
3 + 1 + 1 Three analogous base colors, one complementary accent, one dark anchor — bold yet balanced.

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 #C74375 from deepest shade to lightest tint.

Color Characteristics

Mood
Playful Romantic
Style
Warm
Use case
Text Button Accent

Accessibility Simulation

Deuteranopia #7D7D71
Protanopia #5E5E76
Tritanopia #C44C4C
Achromatopsia #747474

Frequently Asked Questions

Fuchsia Rose (#C74375) is a color with RGB(199, 67, 117) and HSL(337.27°, 66.33%, 78.04%).

#C74375 pairs strongly with #43C795 as its complementary color. It can also be used with neutral tones for balanced UI and design layouts.

#C74375 is suitable for Text, Button, Accent and works well with Warm styles.

#C74375 is commonly associated with Playful, Romantic.

The name Fuchsia Rose is linked to Fuchsia Rose from English, meaning A specific shade of pinkish-purple, named after the fuchsia flower..

Name, History & Etymology

Origin Word Fuchsia Rose
Meaning A specific shade of pinkish-purple, named after the fuchsia flower.
Language English
First Recorded Use Late 20th Century

History

The color 'fuchsia' itself has been recognized since the mid-19th century, named after the fuchsia flower, which was in turn named after German botanist Leonhart Fuchs. 'Fuchsia Rose' is a more specific and vibrant iteration of fuchsia, often associated with fashion and design trends of the late 20th and early 21st centuries. Pantone's 'Fuchsia Rose' (17-2031 TCX) was notably chosen as the Color of the Year for 1994, solidifying its place in color discourse.

First Recorded Use

1990s (specifically 1994 for Pantone's 'Fuchsia Rose')

Cultural Associations

Fuchsia Rose is often associated with vibrancy, femininity, playfulness, and a touch of daring. It was popular in 90s fashion, cosmetics, and interior design. It can evoke feelings of energy and excitement. In some contexts, it might be seen as bold or even flamboyant. It's a color that stands out and demands attention.

Similar Named Colors
Ruber #CE4676 ΔE 1.91
Telemagenta #CF3476 ΔE 2.23
Magenta (Pantone) #D0417E ΔE 2.38
Fuchsia Purple #CC397B ΔE 2.40

Code Snippets

/* Background */
.element {
    background-color: #C74375;
}

/* Text */
.element {
    color: #C74375;
}

/* Border */
.element {
    border: 1px solid #C74375;
}

/* Linear gradient to complementary */
.element {
    background: linear-gradient(
        to right,
        #C74375,
        #A2ECD0
    );
}

/* Radial gradient */
.element {
    background: radial-gradient(
        circle,
        #C74375,
        #A2ECD0
    );
}

// SCSS variable
$fuchsia-rose: #C74375;

// With RGB channels (useful for rgba() usage)
$fuchsia-rose-r: 199;
$fuchsia-rose-g: 67;
$fuchsia-rose-b: 117;

// Usage
.element {
    background-color: $fuchsia-rose;
    color: rgba($fuchsia-rose-r, $fuchsia-rose-g, $fuchsia-rose-b, 0.8);
}