Create CSS Rounded Corners

The use of rounded corners on website has becoming very popular. Many websites are starting to kill the sharp edge and go with rounded corners in their buttons, navigation bar, header, banner, etc. Just how easy these rounded corners images can be created? I’m here to show you few which I think are few of the good ones.

1. Google Rounded Corners Generator

Google rounded corner generator

This google script generates a PNG format rounded corners for you on the fly. Simply copy the scripts below into a browser and hit enter.

http://groups-beta.google.com/groups/roundedcorners? c=999999&bc=white&w=4&h=4&a=tr

Tweak the following parameters to get the rounded corners of your choice.

Parameters:

c	the color, as either a name or a CSS-style color spec (RGB or RRGGBB) sans #. Color names that seem to work: black white gray red green blue yellow teal olive purple. Can you find more?
bc	the background color, same acceptable input as c
h	height in pixels
w	width in pixels
a	which corner to generate; tl is top left, tr is top right, bl is bottom left, br is bottom

2. Spiffy Corners

Spiffy rounded corner generator Spiffy Corners creates you rounded corner without using images. It make use of CSS and HTML to create a rounded corner effect that works well in both Internet Explorer and Firefox. Visit Spiffy and generate your codes.

3. Cornershop

Cornershop rounded corner generator Cornershop is rather a combination of both. You fill up your requirements in the textfield, and your desired corners (in images) will be generated, together with CSS and HTML.

These guys are cool huh? Too much of spoon feeding for web designers :)

If you like this entry, consider bookmarking or help us promote it. Thanks.
Del.icio.us | Stumble | Digg | Mixx | Reddit

Comments

Martin December 14th, 2006

That’s brilliant. Although that can be done in Photoshop, but I guess the website just make it even easier and faster… Will give that a try!
Reply
nic stage December 19th, 2006

i wonder if there will eventually be any bandwidth issues with the web service? that is definitely the most efficient (at least on the developer’s end) solution i have seen so far.
Reply
Miker May 30th, 2007

That is a really good thing I was looking for.
Thank you maaaaann!!!!
Reply
youpost.uni.cc January 8th, 2008

Thank you nice post you got there

how about visiting me. at http://www.youpost.uni.cc
Reply
Nestor Sulu May 27th, 2008

Wow! great article, you have made my day, it was just what I was looking for to finish a new interface I need for tomorrow. A lot of thanks man!
Reply