CSS3 Tricks

Please note that this will only work properly in modern browsers that support the CSS3 properties in use.

Animated Hovers

First Hover

Your tagline goes here

Button

Second Hover

Your tagline goes here

Button

Third Hover

Your tagline goes here

Button

Fourth Hover

Your tagline goes here

Button

Fifth Hover

Your tagline goes here

Button

Sixth Hover

Your tagline goes here

Button

Seventh Hover

Your tagline goes here

Button

Eighth Hover

Your tagline goes here

Button

Ninth Hover

Your tagline goes here

Button

Animated Buttons

Add necessary class to the <a> tag (<a href="#" class=""> Button Text </a>)

Click me!class="pro_btn pro_style_1"
Click me!class="pro_btn pro_warning pro_style_1"
Click me!class="pro_btn pro_success pro_style_1"
Click me!class="pro_btn pro_danger pro_style_1"
Any button may be longerclass="pro_btn pro_inf pro_style_1"
Click me!class="pro_btn pro_style_2"
Click me!class="pro_btn pro_warning pro_style_2"
Any button may be longerclass="pro_btn pro_success pro_style_2"
Click me!class="pro_btn pro_danger pro_style_2"
Click me!class="pro_btn pro_inf pro_style_2"
Click me!class="pro_btn pro_style_3"
Click me!class="pro_btn pro_warning pro_style_3"
Click me!class="pro_btn pro_success pro_style_3"
Any button may be longerclass="pro_btn pro_danger pro_style_3"
Click me!class="pro_btn pro_inf pro_style_3"
Click me!class="pro_btn pro_style_4"
Any button may be longerclass="pro_btn pro_warning pro_style_4"
Click me!class="pro_btn pro_success pro_style_4"
Click me!class="pro_btn pro_danger pro_style_4"
Click me!class="pro_btn pro_inf pro_style_4"

CSS3 Images Style

Shadows on CSS3

Lifted Shadow
Perspective Shadow
Raised Block
Shadow with two vertical curves
Shadow with two horizontal curves