You simply make the request to the URL of the image.

For example, if your image is called test1.png and you have it in a directory called images, you would make the URL like this:

https://your.domain/images/test1.png

If you want to hide the full path to the images and serve them through a page (so you have some control over the request for some reason), you can do something more like the following. Let's call the PHP page img.php. And the request could be like

https://your.domain/img.php/test1

<?php
$request = './default.png';
if (isset($_SERVER['PATH_INFO'])){
    $request = './images'.$_SERVER['PATH_INFO'].'.png';
    if (! file_exists($request)){
        $request = './default.png';
    }
}

// we now know we have a valid request and the file was found
header('Content-type: image/png');
header('Content-Length: '.filesize($request));
echo file_get_contents($request);
exit;
?>

With this approach you could have any number of images in the /images/ directory and serve them if they match the request.

The website in your sample maybe using the same $_SERVER['PATH_INFO'] info approach but would be dynamically creating the image using the passed variables and explode('/',$_SERVER['PATH_INFO']) along with imagecreate()

A very quick hack version would be something like the following. The request would be like this:

https://your.domain/test.php/100x50/919/222

And the very quick code, with almost no error checking could be:

<?php
function hexToColor($hx){
    $rgb = array(0,0,0);
    if (strlen($hx) == 3){
        $rgb[0] = hexdec($hx[0].$hx[0]);
        $rgb[1] = hexdec($hx[1].$hx[1]);
        $rgb[2] = hexdec($hx[2].$hx[2]);
    } else {
        $rgb[0] = hexdec($hx[0].$hx[1]);
        $rgb[1] = hexdec($hx[2].$hx[3]);
        $rgb[2] = hexdec($hx[4].$hx[5]);
    }
    return $rgb;
}

// default values
$sizeW = 100;
$sizeH = 100;
$bg = array(0,0,0);
$fg = array(255,255,255);

if (isset($_SERVER['PATH_INFO'])){
    $opts = explode('/',substr($_SERVER['PATH_INFO'],1));
    $bgSet = false;
    foreach($opts as $k => $v){
        // check for a width x height request
        if (strpos($v,'x')){
            $tmp = explode('x',$v);
            $sizeW = $tmp[0];
            $sizeH = $tmp[1];
        } elseif ($bgSet){
            // must be a foreground request
            $fg = hexToColor($v);
        } else {
            $bg = hexToColor($v);
            $bgSet = true;
        }
    }
}

header("Content-Type: image/png");
$im = @imagecreate($sizeW,$sizeH)
    or die("Cannot Initialize new GD image stream");
$background_color = imagecolorallocate($im,$bg[0],$bg[1],$bg[2]);
$text_color = imagecolorallocate($im,$fg[0],$fg[1],$fg[2]);
imagestring($im,1,5,5,$sizeW.' x '.$sizeH,$text_color);
imagepng($im);
imagedestroy($im);
exit;
?>

But I would strongly recommend a heap of error checking before using that code!

As I understand you want to dynamically update the picture.

You can see that on their main website they created a form for the entered values:

After that, on the picture URL there are all the values you need to display this image:

https://dummyimage.com/600x400/8a1a8a/232dba&text=xzcxzcnbngh

which is this image:

what you can't see is their server side, which takes the parameters 600x400/8a1a8a/232dba&text=xzcxzcnbngh, creates a picture using their server and returning it to you.

I'll suggest you to create a server side that will return a picture and text based on the given parameters.

based on your server you will need to find out how to create the picture and return it.

As you can see here, I just modified the "src" value of the and it changed the text on the photo.

which means that their server receives the request and send back the image.

If you want a simple solution you could just send back those parameters to your page scripts, and create this image element using JavaScript. That way, your html code will be clean without even the img element tag.

create your img in JS and send put it on the html body.

Image placeholder that’s updated by scripting HTML code:

<img id="abc" src="">

Javascript code:

var abcImage = document.getElementById('abc');
abcImage.src = 'https://dummyimage.com/600x400/000/fff';