CSS-based rounded corner solutions are excellent for website layouts, but it’s just downright silly to envelope a single img tag with two to four extraneous divs just to get some nice rounded corners on that one image. PHP (with its GD library) is excellent for this purpose.
My PHP script can take any jpg, png, or static gif image (supplied through the “src” GET variable) and apply rounded corners to them. The space left by the corners is transparent, and so blends in with any background you may have applied to your content section.
Using GET variables, you can control various aspects of the output image. Using “rad” or “radius”, you can increase and decrease the size of the corners. The default value for the radius is 20, which I’ve found to be reasonable for most images.
Using “width” or “height”, you can scale down the image to meet your needs — the specified width or height will be taken as the maximum width or height, in pixels, and the aspect ratio will be maintained. If both height and width are given, the smallest result of the two possible outputs will be used.
There is also a “squarification” option, which will reduce either the width or height (whichever is largest) to produce a squared image. If “squared” is specified as true, radius and scaling will take effect as normal, using the new squared aspect ratio in place of the old ratio.
The final option, which was kind of an afterthought, is the “format” option — you can choose either “png” or “gif” as the output format. I only added this because with png format, in IE6, the method I used would produce magenta-colored corners, rather than transparent colors. Supplying a gif output fixes this problem for IE6, though the png option is generally preferred.
The source of the script is very well documented, but feel free to ask questions if I missed something.
The example directory.
Active script using a local image, for your experimentation (any other image can be specified through “src”).
Highlighted script source.
Plain text script source.