Round Corners on Image Using PHP and GD Library

Sometimes we need to add round corners to some pictures like profile picture and thumbnails, also not to modify the source files. It can be achieve through CSS but to work proper on all browsers, its too hard to get. So with GD library, it can be achieved with less work. In this post I am providing an example to achieve round corners on image using PHP and GD library.

I have created a function imageCreateCorners that provides an image resource of round corners, you can save this as PNG image.

function imageCreateCorners($sourceImageFile, $radius = 20) {
	# test source image
	if (file_exists($sourceImageFile)) {
	  $res = is_array($info = getimagesize($sourceImageFile));
	  }
	else $res = false;

	# open image
	if ($res) {
	  $w = $info[0];
	  $h = $info[1];

	  switch ($info['mime']) {
		case 'image/jpeg': $src = imagecreatefromjpeg($sourceImageFile);
		  break;
		case 'image/gif': $src = imagecreatefromgif($sourceImageFile);
		  break;
		case 'image/png': $src = imagecreatefrompng($sourceImageFile);
		  break;
		default:
		  $res = false;
		}
	  }

	# create corners
	if ($res) {

	  $q = 8; # change this if you want
	  $radius *= $q;

	  # find unique color
	  do {
		$r = rand(0, 255);
		$g = rand(0, 255);
		$b = rand(0, 255);
		}
	  while (imagecolorexact($src, $r, $g, $b) < 0);

	  $nw = $w*$q;
	  $nh = $h*$q;

	  $img = imagecreatetruecolor($nw, $nh);
	  $alphacolor = imagecolorallocatealpha($img, $r, $g, $b, 127);
	  imagealphablending($img, false);
	  imagesavealpha($img, true);
	  imagefilledrectangle($img, 0, 0, $nw, $nh, $alphacolor);

	  imagefill($img, 0, 0, $alphacolor);
	  imagecopyresampled($img, $src, 0, 0, 0, 0, $nw, $nh, $w, $h);

	  imagearc($img, $radius-1, $radius-1, $radius*2, $radius*2, 180, 270, $alphacolor);
	  imagefilltoborder($img, 0, 0, $alphacolor, $alphacolor);
	  imagearc($img, $nw-$radius, $radius-1, $radius*2, $radius*2, 270, 0, $alphacolor);
	  imagefilltoborder($img, $nw-1, 0, $alphacolor, $alphacolor);
	  imagearc($img, $radius-1, $nh-$radius, $radius*2, $radius*2, 90, 180, $alphacolor);
	  imagefilltoborder($img, 0, $nh-1, $alphacolor, $alphacolor);
	  imagearc($img, $nw-$radius, $nh-$radius, $radius*2, $radius*2, 0, 90, $alphacolor);
	  imagefilltoborder($img, $nw-1, $nh-1, $alphacolor, $alphacolor);
	  imagealphablending($img, true);
	  imagecolortransparent($img, $alphacolor);

	  # resize image down
	  $dest = imagecreatetruecolor($w, $h);
	  imagealphablending($dest, false);
	  imagesavealpha($dest, true);
	  imagefilledrectangle($dest, 0, 0, $w, $h, $alphacolor);
	  imagecopyresampled($dest, $img, 0, 0, 0, 0, $w, $h, $nw, $nh);

	  # output image
	  $res = $dest;
	  imagedestroy($src);
	  imagedestroy($img);
	  }

	return $res;
}

I have used this function as follow:

$radius = ($_POST['radius']) ? $_POST['radius'] : '5';

if(!$_FILES['imgfile']['error']){
	$ext = pathinfo ( $_FILES['imgfile']['name'], PATHINFO_EXTENSION);
	$filename = md5(time()).'.'.$ext;
	$destination = $_SERVER['DOCUMENT_ROOT'].'/uploads/'.$filename;
	$rounded_filename = md5(time()).'_round.png';
	$rounded_destination = $_SERVER['DOCUMENT_ROOT'].'/uploads/'.$rounded_filename;

	if (move_uploaded_file($_FILES['imgfile']['tmp_name'], $destination)) { ?>
	  <img src="<?php echo createRoundImage($destination, $rounded_destination, $radius);?>" alt="example" />
	<?php }
}

And the createRoundImage function as below that calls imageCreateCorners and save the result in png format and return the path of rounded image.

function createRoundImage($sourceFile, $destinationFile, $radius = 20){
	$roundImage = imageCreateCorners($sourceFile, $radius);
	imagepng($roundImage, $destinationFile, 9);

	$filename = pathinfo($destinationFile, PATHINFO_BASENAME);
	return 'uploads/'.$filename;
}

You just need to provide the source file path and radius and it will provide the output as rounded corners. It is a server side script so no need CSS and Javascript  support. Also it will not affect your source images. You just need to call this function in src attribute of img tag, thats it.

Limitation : It might take longer time to generate round corners for big images because of GD library. So resize it before round corners, if applicable.

Live Demo