ColorCodes.art

Pink Color Hex Code Guide

Discover all shades of pink with their hex codes, RGB, and HSL values. Find the perfect pink color for your website design, branding, or creative project.

#FFC0CBPink
#FF69B4Hot Pink
#FF1493Deep Pink
SEE ALL SHADES →

Find Your Perfect Pink

Use our interactive tool below to find the perfect shade of pink for your project. Simply select a color and get the corresponding hex code instantly.

All Shades of Pink

Pink is a versatile color with many different shades, from pale blush tones to vibrant hot pink. Here's a comprehensive collection of pink hex codes for your web design and development projects.

Light Pink Shades

Pink

HEX: #FFC0CB

RGB: 255, 192, 203

HSL: 350, 100%, 88%

Light Pink

HEX: #FFB6C1

RGB: 255, 182, 193

HSL: 351, 100%, 86%

Pale Pink

HEX: #FADADD

RGB: 250, 218, 221

HSL: 355, 67%, 92%

Orchid Pink

HEX: #F2BDCD

RGB: 242, 189, 205

HSL: 338, 65%, 85%

Medium Pink Shades

Blush Pink

HEX: #FE828C

RGB: 254, 130, 140

HSL: 355, 99%, 75%

Coral Pink

HEX: #F88379

RGB: 248, 131, 121

HSL: 5, 90%, 73%

Salmon Pink

HEX: #FF91A4

RGB: 255, 145, 164

HSL: 348, 100%, 78%

Lavender Pink

HEX: #FBAED2

RGB: 251, 174, 210

HSL: 334, 91%, 83%

Bright and Vibrant Pink Shades

Hot Pink

HEX: #FF69B4

RGB: 255, 105, 180

HSL: 330, 100%, 71%

Deep Pink

HEX: #FF1493

RGB: 255, 20, 147

HSL: 328, 100%, 54%

Rose Pink

HEX: #FF66CC

RGB: 255, 102, 204

HSL: 320, 100%, 70%

Fuchsia Pink

HEX: #FF00FF

RGB: 255, 0, 255

HSL: 300, 100%, 50%

Pink Color Trivia

  • The word 'pink' first appeared as a color name in the late 17th century.

  • Pink was traditionally associated with boys until the mid-20th century, when it became associated with girls.

  • Pink is often associated with romance, sensitivity, and tenderness.

  • Hot pink (#FF69B4) was one of the original HTML named colors introduced in 1992.

  • Baker-Miller Pink (#FF91AF) is a specific shade of pink that has been used in some prisons and hospitals for its apparent calming effect.

How to Use Pink Color Hex Codes

Using Pink in CSS

.hero-section {
  background-color: #FFC0CB; /* Pink */
  color: #333333;
}

.button-primary {
  background-color: #FF69B4; /* Hot Pink */
  color: #FFFFFF;
  border: none;
}

.highlight {
  color: #FF1493; /* Deep Pink */
  font-weight: bold;
}

Use pink hex codes in your CSS to add color to backgrounds, text, buttons, and other elements.

Using Pink in HTML

<!-- Inline styling with pink hex codes -->
<div style="color: #FF69B4;">
  This text is hot pink
</div>

<p style="background-color: #FADADD; 
          color: #333333;">
  Dark text on pale pink background
</p>

<span style="border: 2px solid #FF1493;">
  This has a deep pink border
</span>

You can also use pink hex codes directly in HTML for quick styling of specific elements.

Tips for Using Pink in Web Design

  • Balance with neutrals: Pair pink with white, gray, or black to keep your design balanced and professional.

  • Contrast for accessibility: Ensure text has sufficient contrast against pink backgrounds for readability.

  • Complementary colors: Green shades complement pink well if you're looking for color contrast.

  • Create palettes: Use different shades of pink together for a cohesive monochromatic color scheme.

Popular Color Combinations with Pink

Here are some effective color combinations that work well with different shades of pink:

Pink & Purple

A feminine, dreamy combination

Pink & Teal

A vibrant, trendy contrast

Pink & Gray

A sophisticated, modern pairing

Pink in Branding and Design

Brand Meanings of Pink

Pink is frequently used in branding to convey specific attributes and emotions:

  • Femininity - Often associated with feminine products and brands

  • Playfulness - Particularly with brighter pinks

  • Compassion & Care - Used in healthcare and charity organizations

  • Sweetness - Common in food and confectionery branding

  • Romance - Lighter pinks for gentle romance, deeper pinks for passion

Famous Brands Using Pink

Several well-known brands have incorporated pink into their visual identity:

  • Barbie - Uses a bright pink (#E0218A) as its signature color

  • Victoria's Secret - Known for its pink branding in its PINK line

  • T-Mobile - Uses a vibrant magenta pink (#E20074) as its primary color

  • Baskin-Robbins - Incorporates a medium pink in its logo

  • Dunkin' - Uses a pink-orange combination in its branding

Frequently Asked Questions

What is the hex code for pink?

There are many different shades of pink with their own hex codes. The standard pink color hex code is #FFC0CB. Hot pink is #FF69B4, deep pink is #FF1493, light pink is #FFB6C1, and pale pink is #FADADD. Our page provides a comprehensive list of all pink shades with their corresponding hex codes.

How can I use pink color hex codes in my website?

To use pink color hex codes in your website, include them in your CSS or HTML files where color properties are specified. For example, to set a pink background color in CSS, you would write: body { background-color: #FFC0CB; }. For text color: p { color: #FF69B4; }. In HTML inline styles, you could use: <div style="background-color: #FFC0CB;">This has a pink background</div>.

What colors go well with pink?

Pink pairs well with several colors depending on the look you're going for. For a soft, feminine palette, try pink with white, cream, or light gray. For contrast, pink works well with navy blue, charcoal, or forest green. For a vibrant look, combine pink with turquoise, yellow, or orange. Monochromatic schemes using different shades of pink also work well. The best complementary color to pink is generally a shade of green.

What is the difference between hot pink and deep pink?

Hot pink (#FF69B4) is a bright, vibrant pink that leans slightly more toward red than purple. Deep pink (#FF1493) is a much more intense and saturated pink that appears darker and more vivid. Deep pink contains less blue and more red than hot pink, making it appear more dramatic and bold. Hot pink is often used for playful, energetic designs, while deep pink is used when a stronger, more striking pink is needed.

Is pink a good color for website backgrounds?

Pink can work well as a website background color when used appropriately. Lighter pinks like #FADADD or #FFE4E1 can serve as subtle, neutral backgrounds that don't overwhelm content. For a bolder approach, deeper pinks can be used for specific sections or accent areas. When using pink as a background, ensure there's enough contrast with your text colors for readability. Pink backgrounds work particularly well for fashion, beauty, children's products, and creative industry websites.

Related Color Tools

Find Your Perfect Pink Color Today

Use our interactive color picker to discover the ideal pink shade for your next project

Start Picking Colors