HyperlinkCode.com

How to create 500 totally unique, human-quality articles in just 45 seconds ..

#CC9999 CSS and HTML for Hyperlinks

HTML and CSS code to style hyperlinks with hex color #CC9999 for color, shadow, glow and underline effects.

#CC9999 Colored Hyperlinks

HTML and Inline CSS

Can be used directly into HTML documents same as standard hyperlink.

<a href="CC9999.php" style="color: #CC9999;">Link colored with #CC9999 hex color</a>

CSS Code

Can be used in external or internal stylesheet along with other CSS properties.

a:link {
color: #CC9999;
}
a:visited {
color: #CC9999;
}
a:hover {
color: #CC9999;
}

Output

Link colored with #CC9999 hex color

Select output background color:  [more]

#CC9999 Shadow Hyperlink

HTML and Inline CSS

Can be used directly into HTML documents same as standard hyperlink.

<a href="CC9999.php" style="text-decoration: none; text-shadow: 3px 3px 2px #CC9999;">This is a link with shadow color #CC9999</a>

CSS Code

Can be used in external or internal stylesheet along with other CSS properties.

a{
text-decoration: none;
}
a:link {
text-shadow: 3px 3px 2px #CC9999;
}
a:visited {
text-shadow: 3px 3px 2px #CC9999;
}
a:hover {
text-shadow: 3px 3px 2px #CC9999;
color: #DD0000;
}

Output

This is a link with shadow color #CC9999

Select output background color:  [more]

#CC9999 Glowing Hyperlink

HTML and Inline CSS

Can be used directly into HTML documents same as standard hyperlink.

<a href="CC9999.php" style="text-decoration: none; text-shadow: 0px 0px 2px #CC9999;">This is a link with glow color #CC9999</a>

CSS Code

Can be used in external or internal stylesheet along with other CSS properties.

a{
text-decoration: none;
}
a:link {
text-shadow: 0 0 2px #CC9999;
}
a:visited {
text-shadow: 0 0 2px #CC9999;
}
a:hover {
text-shadow: 0 0 2px #CC9999;
color: #DD0000;
}

Output

This is a link with glow color #CC9999

Select output background color:  [more]

#CC9999 Hyperlink Underline Color

HTML and Inline CSS

Can be used directly into HTML documents same as standard hyperlink.

<a href="CC9999.php" style="text-decoration: none; border-bottom: 1px solid #CC9999;">This is a link with underline color #CC9999</a>

CSS Code

Can be used in external or internal stylesheet along with other CSS properties.

a{
text-decoration: none;
}
a:link {
border-bottom: 1px solid #CC9999;
}
a:visited {
border-bottom: 1px solid #CC9999;
}
a:hover {
border-bottom: 1px solid #CC9999;
color: #DD0000;
}

Output

This is a link with underline color #CC9999

Select output background color:  [more]

The underline thickness can be made thicker by changing 1px to higher value such as 2px 3px and so on.

See also dashed and dotted underline CSS and additional underline effects with external CSS.

Free web design videos! Learn the easy way to responsive (mobile friendly) web design.

#CC9999 Dashed Underline Hyperlink

HTML and Inline CSS

Can be used directly into HTML documents same as standard hyperlink.

<a href="CC9999.php" style="text-decoration: none; border-bottom: 2px dashed #CC9999;">This is a link with dashed underline color #CC9999</a>

CSS Code

Can be used in external or internal stylesheet along with other CSS properties.

a{
text-decoration: none;
}
a:link {
border-bottom: 2px dashed #CC9999;
}
a:visited {
border-bottom: 2px dashed #CC9999;
}
a:hover {
border-bottom: 2px dashed #CC9999;
color: #DD0000;
}

Output

This is a link with dashed underline color #CC9999

Select output background color:  [more]

The dash size can be changed by changing 2px to 1px, 3px and so on.

See also dotted underline CSS and additional dashed underline effects with external CSS.

#CC9999 Dotted Underline Hyperlink

HTML and Inline CSS

Can be used directly into HTML documents same as standard hyperlink.

<a href="CC9999.php" style="text-decoration: none; border-bottom: 2px dotted #CC9999;">This is a link with dotted underline color #CC9999</a>

CSS Code

Can be used in external or internal stylesheet along with other CSS properties.

a{
text-decoration: none;
}
a:link {
border-bottom: 2px dotted #CC9999;
}
a:visited {
border-bottom: 2px dotted #CC9999;
}
a:hover {
border-bottom: 2px dotted #CC9999;
color: #DD0000;
}

Output

This is a link with dotted underline color #CC9999

Select output background color:  [more]

The dot size can be changed by changing 2px to 1px, 3px and so on.

See also dashed underline CSS and additional dotted underline effects with external CSS.

See also html-color-names.com for matching colour palettes with hex color codes.

Back to color chart.

Related

© Copyright 2007 - 2017 HyperlinkCode.com.
Site Admin: Ed Zivkovic. Privacy | Terms