Create rounded corners without using external images

Rounded corners are one of the biggest web design trends. Usually rounded corners are created using images as backgrounds for the section we want to appear rounded (such as those used in the Rounders template or created using Cornershop). However, it is also possible to create rounded corners using only CSS styling!

Spiffy corners is a site which can generate the code for you, based on the foreground and background colors you specify. Then all you need to do is add the code to your blog template, and your rounded corners will appear in your sidebar, your main posts section, or indeed anywhere you wish in your blog!

The rounded corners wizard is really simple to use: all you need to do is specify the colors you wish to use and a preview image is generated for you. You can then choose the amount of "roundness" you require and the wizaed will generate two sets of code for you to use: the CSS style code, and the html code to wrap around your blog elements. Then all you need to do is copy and paste these codes into your blog template.

For Bloggers, this is very advantageous, since this dismisses the need for externally hosted images to create the rounded corner effect. Also, this helps speed up page loading time as the corners are created in the style rather than by calling images from the server.

I will certainly be using this technique in my new design for the site, and heartily recommend this as an alternative for those who wish to design Web 2.0 style corners for their blog templates. Take a look at the Spiffy Corners site and let me know what you think too.

Technorati Tags: rounded+corners | web+design | blog+templates | web+2.0