Articles

Bold and Beautiful Drop-Down Navigation Menu

Fri, 31 Jan 2014 07:49:38 GMT

Very beautiful and bold looking navigation menu created by Jordan Austin. This menu is two level and has some pretty cool animation effects achieved by using transition property of CSS3 when the link or menu is hovered.

The dropdown menu is initially hidden by setting its visibility property to hidden and opacity to 0. When the link is hovered, the visibility is set to visible and the opacity to 1 with some changes in position to make the animation better. Take a look at the code to understand what's happening here.

Checkout Form

Fri, 31 Jan 2014 07:38:17 GMT

By CSSFlow: free UI elements and widgets coded with HTML5, CSS3, and Sass.

View the original article and download the Sass source at:
cssflow.com/snippets/checkout-form

Original PSD by Umar Irshad.

Tested in Firefox 4, Safari 4, Chrome 14, Opera 10, IE 8 (and newer).

Facebook Login Form

Thu, 30 Jan 2014 09:50:50 GMT

By CSSFlow: free UI elements and widgets coded with HTML5, CSS3, and Sass.

View the original article and download the Sass source at:
cssflow.com/snippets/facebook-login-form

Original PSD by Alex Montague.

Tested in Firefox 4, Safari 4, Chrome 14, Opera 10, IE 8 (and newer).

3D Buttons

Thu, 30 Jan 2014 06:30:17 GMT

A set of multi-colored 3D buttons. Include a normal, hover and active state.

Different CSS3 Box Shadows Effects

Tue, 28 Jan 2014 17:18:25 GMT

Different CSS3 Box Shadows Effects by PaulUnd. These effects were first designed in Photoshop and then implemented using CSS3. The main key here is the use of box-shadow property. To create multiple shadows, :after and :before pseudo elements are used. Feel free to use them in your projects. It supports all major browsers that supports box-shadow property:

• Internet Explorer 9.0 and higher
• Firefox 3.5 and higher
• Chrome 1 and higher
• Safari 3 and higher
• Opera 10.5 and higher