Rose Pink

HEX: #FF66CC | Modern Palette

On White
2.62:1
FAIL
On Black
8.02:1
PASS

Color Specifications

HEX
#FF66CC
RGB
255, 102, 204
HSL
320°, 100% ,70%
CMYK
0, 60, 20, 0

About Rose Pink

Rose Pink (#FF66CC) is a color with RGB(255, 102, 204) and HSL(320°, 100%, 70%). It is commonly associated with Energetic, Bold moods. In design, it fits Vivid, Neon styles and is suitable for Text, Button, Accent. Its complementary color is #66FF99, which creates strong contrast. Its triadic palette includes #CCFF66 and #66CCFF. The name comes from Rose Pink (English).

  • HEX: #FF66CC
  • RGB: 255, 102, 204
  • HSL: 320°, 100%, 70%
  • Mood: Energetic, Bold
  • Style: Vivid, Neon
  • Use case: Text, Button, Accent
  • Complementary color: #66FF99
  • Triadic colors: #CCFF66, #66CCFF
  • The name comes from Rose Pink (English).

Live Components

LIGHT
DARK
System Notification Box

Color Palettes

Rose Pink #FF66CC is used in Monochromatic, Neutral + Accent, Analogous, 3 + 1 + 1 palettes, giving designers ready-made combinations for backgrounds, surfaces, accents, and interface elements.

Monochromatic Five tones of the same hue — a reliable scale for backgrounds, surfaces, and text.
 
 
 
ROSE PINK
 
Neutral + Accent Four near-neutral tones grounded by a saturated accent — clean and versatile for UI.
 
 
ROSE PINK
 
 
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

Rose Pink #FF66CC pairs with #66FF99 as its complementary color, and #CCFF66 and #66CCFF in triadic combinations. These harmony relationships help create balanced color combinations for UI, branding, and design work.

Complementary

The color directly opposite on the color wheel — creates maximum contrast and vibrance.

ROSE PINK
Analogous

Colors adjacent on the wheel — naturally harmonious and pleasing to the eye.

ROSE PINK
Triadic

Three colors equally spaced 120° apart — bold, balanced, and visually rich.

ROSE PINK
Split-Complementary

Two colors flanking the complement — high contrast with less tension than full complementary.

ROSE PINK
Tetradic (Square)

Four colors at 90° intervals — rich variety, best when one color dominates.

ROSE PINK
Monochromatic

Shades and tints of the same hue — cohesive, elegant, and easy to work with.

ROSE PINK

Shades & Tints

The shade and tint range for Rose Pink #FF66CC moves from dark #1A0011 tones through the base color to lighter #FFE6F7 tones, making it useful for depth, hierarchy, and background variation.

ROSE PINK

Color Characteristics

Mood
Energetic Bold
Style
Vivid Neon
Use case
Text Button Accent

Accessibility Simulation

Deuteranopia #A7A7C9
Protanopia #8383CD
Tritanopia #F87979
Achromatopsia #A0A0A0

Frequently Asked Questions

Rose Pink (#FF66CC) is a color with RGB(255, 102, 204) and HSL(320°, 100%, 70%).

#FF66CC pairs strongly with #66FF99 as its complementary color. It can also be used with neutral tones for balanced UI and design layouts.

#FF66CC is suitable for Text, Button, Accent and works well with Vivid, Neon styles.

#FF66CC is commonly associated with Energetic, Bold.

The name Rose Pink is linked to Rose Pink from English, meaning A color resembling the petals of a pink rose..

Name, History & Etymology

Origin Word Rose Pink
Meaning A color resembling the petals of a pink rose.
Language English
First Recorded Use Late 18th Century

History

The color 'rose pink' is a straightforward descriptive name, combining the flower 'rose' with the color 'pink'. Pink itself, as a distinct color name, only became common in the 17th century. Before that, it was often described as a light red. The specific 'rose pink' hue gained popularity in fashion and art, particularly during periods that favored pastel and floral aesthetics, such as the Rococo era and later in Victorian times. Its association with roses gives it connotations of beauty, romance, and femininity. In the digital age, 'rose pink' is often associated with specific hex codes like #FF66CC, which is a vibrant, medium-to-light pink.

First Recorded Use

The term 'rose pink' as a color descriptor likely emerged as roses became more widely cultivated and their specific shades were distinguished. Early references to 'rose' as a color date back further, but 'rose pink' specifies a particular hue.

Cultural Associations

Rose pink is widely associated with femininity, love, and romance, largely due to its connection with the rose flower, a universal symbol of these concepts. It is frequently used in bridal wear, baby girl items, and romantic gifts. In some cultures, pink, including rose pink, can also symbolize youth, innocence, and sweetness. It has seen various trends in fashion, from the delicate shades of the 18th century to the more vibrant interpretations of the 20th and 21st centuries. It's a popular choice for cosmetics, interior design, and branding that aims for a soft, appealing, or luxurious feel.

Similar Named Colors
Light Deep Pink #FF5CCD ΔE 1.67
Neon Fuchsia #FE59C2 ΔE 2.39
Purple Pizzazz #FE4EDA ΔE 4.82
Hot Pink #FF69B4 ΔE 4.98

Code Snippets

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

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

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

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

/* Radial gradient */
.element {
    background: radial-gradient(
        circle,
        #FF66CC,
        #66FF99
    );
}

// SCSS variable
$rose-pink: #FF66CC;

// With RGB channels (useful for rgba() usage)
$rose-pink-r: 255;
$rose-pink-g: 102;
$rose-pink-b: 204;

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