Rounded corners using PHP and the GD library

Why GD library?

I needed to add rounded corners to some pictures and didn’t want to modify the source files in Photoshop (I think it’s a bad idea to modify original pictures if the effect can be added dynamically).

First, I thought CSS would do the trick. But after finding some tutorials on the web (some also use Javascript), I realized that to get it working in most web browsers, it doesn’t seem that easy, and it generally means that you have to create wrapping DIVs.

That’s when I decided to use the GD library, which I had found very useful in other projects. I’m not saying that this solution is perfect or better that others, but it has worked very well for me, and I hope it will be useful to some of you as well.

Advantages of this solution:

  • Flexible: You can chose which corner(s) to round as well as the radius
  • Cross-browser: Since the rounded corners are applied server-side, there’s no need for CSS or Javascript support
  • Clean: no wrapping DIVs
  • The entire image can be rotated and still have rounded corners.

Known limitations:

  • Depending on your rounded corner image, a black border might be shown when using a radius different from the one in that rounded corner image, because of some transparency issues in the GD library. Thus, use a corner image with the correct size, if possible.
  • The src attribute must point to the function file, so you have to change the IMG tags in your code, for the pictures that need to have rounded corners.

PHP Code

How to use it?

Needless to say, PHP and the GD library needs to be installed on your server. You’ll also need a png file of the corner. You can use one of our corner images if you want.

Just paste the code above and save it in a .php file. Make the necessary changes to the $images_dir and $corner_source variables (lines 10 and 11). Link the src attribute of your image to that file, using the following URL variables:

  • src: name of the image file
  • radius (optional): value that represents the radius (in pixels) of the corners; use this to resize the corner image
  • angle (optional): value that represents the rotation angle of the full image, in degrees
  • topleft=no (optional): do not round the top-left corner
  • bottomleft=no (optional): do not round the bottom-left corner
  • bottomright=no (optional): do not round the bottom-right corner
  • topright=no (optional): do not round the top-right corner

Examples

Please contact us or leave a comment below if you have any questions about this code.

3 thoughts on “Rounded corners using PHP and the GD library

  1. Dave

    Hello, When I use the library, the corners do get rounded, however, they are not transparent corners. The corners are solid white. Can it do rounded transparent corners?

    Reply
    1. Michael Post author

      Transparency is currently not supported. It would have been great to offer the possibility, but it wasn’t included because it didn’t give good results, with GD displaying a thin, dark border along the arc, which looked very bad on light pictures. If we find a solution to this problem, we’ll update the code accordingly, though.
      Regards


      If you find this script useful, please consider making a donation to show me your appreciation; any amount will be welcome. Regardless, this script will always be available for free.
      Donate through PayPal

      Reply

Leave a comment