Dynamic multi-color gradient image

Question

What i need to create is a dynamic multi-color gradient image like the below one :

I need to create it dynamically for 2/3/4/5/6 colors, for now i'm working on 6 color gradient.

What i've done till now is :

$size = 1536;
$thickness = 54;
$im = imagecreatetruecolor($size, $thickness);

$clrCount = count($clr);            
$limit = floor($size/$clrCount);

        for($i = 0; $i < $limit; $i++) {

            // Line 1: red = 255 ; green = 0 -> 255 ; blue = 0
            $mycolors[$i] = imagecolorallocate($im, 255, $i, 0);
            // Line 2: red = 255 -> 0 ; green = 255 ; blue = 0
            $mycolors[$i + $limit] = imagecolorallocate($im, (255 - $i), 255, 0);
            // Line 3: red = 0 ; green = 255 ; blue = 0 -> 255
            $mycolors[$i + $limit*2] = imagecolorallocate($im, 0, 255, $i);
            // Line 4: red = 0 ; green = 255 -> 0 ; blue = 255
            $mycolors[$i + $limit*3] = imagecolorallocate($im, 0, (255 - $i), 255);
            // Line 5: red = 0 -> 255 ; green = 0 ; blue = 255
            $mycolors[$i + $limit*4] = imagecolorallocate($im, $i, 0, 255);
            // Line 6: red = 255 ; green = 0 ; blue = 255 -> 0
            $mycolors[$i + $limit*5] = imagecolorallocate($im, 255, 0, (255 - $i));


        }

        for ($i=0; $i < $size; $i++) { 
            imageline($im, $i, 0, $i, $thickness-1, $mycolors[$i]);
        }

imagepng($im);
imagegd($im);
imagedestroy($im);

I created the above image with the help of this article

But the code here is using static color codes, when i tryed to manipulate with it i'm getting image like below :

EDITED CODE

$size = 1536;
$thickness = 54;
$im = imagecreatetruecolor($size, $thickness);

$clrCount = count($clr);            
$limit = floor($size/$clrCount);

$clr = array(0 => '4d6eae', 1 => 'e58f0e', 2 => 'ff00ff', 3 => '9900ff', 4 => '9f560a', 5 => '93c47d');

        list($r, $g, $b) = sscanf($clr[0], "%02x%02x%02x");
        list($r1, $g1, $b1) = sscanf($clr[1], "%02x%02x%02x");
        list($r2, $g2, $b2) = sscanf($clr[2], "%02x%02x%02x");
        list($r3, $g3, $b3) = sscanf($clr[3], "%02x%02x%02x");
        list($r4, $g4, $b4) = sscanf($clr[4], "%02x%02x%02x");
        list($r5, $g5, $b5) = sscanf($clr[5], "%02x%02x%02x");

        for($i = 0; $i < $limit; $i++) {

            // Line 1: red = 255 ; green = 0 -> 255 ; blue = 0
            $mycolors[$i] = imagecolorallocate($im, $r, $i, 0);
            // Line 2: red = 255 -> 0 ; green = 255 ; blue = 0
            $mycolors[$i + $limit] = imagecolorallocate($im, ($r1 - $i), $g1, 0);
            // Line 3: red = 0 ; green = 255 ; blue = 0 -> 255
            $mycolors[$i + $limit*2] = imagecolorallocate($im, 0, $g2, $i);
            // Line 4: red = 0 ; green = 255 -> 0 ; blue = 255
            $mycolors[$i + $limit*3] = imagecolorallocate($im, 0, ($g3 - $i), 255);
            // Line 5: red = 0 -> 255 ; green = 0 ; blue = 255
            $mycolors[$i + $limit*4] = imagecolorallocate($im, $i, 0, $b4);
            // Line 6: red = 255 ; green = 0 ; blue = 255 -> 0
            $mycolors[$i + $limit*5] = imagecolorallocate($im, $r5, 0, ($b5 - $i));


        }

        for ($i=0; $i < $size; $i++) { 
            imageline($im, $i, 0, $i, $thickness-1, $mycolors[$i]);
        }

imagepng($im);
imagegd($im);
imagedestroy($im);

You can see that the gradient effect is lost, because the static 255 is replaced with dynamic value which is creating negative numbers and thus losing its effect.

Can anybody help me creating a dynamic color gradient image with this code or can help provide me another direction to achieve this kind of output with gd library.

UPDATED

Now when i got the answer to this question, i've a new problem related to this question.

What i want to achieve is a random color allocation now, somewhat like this below :

I'm going with the six color array as in case with the problem above, need some hint to get going.

Answer 1

You found the problem yourself already, actually.. So let's work further on that:

You can see that the gradient effect is lost, because the static 255 is replaced with dynamic value which is creating negative numbers and thus losing its effect.

So, instead of decreasing with $i each time, you have to decrease with a percentage of $i.

PSEUDOCODE

We want to go from red value: 50 to red value: 200 in 75 steps. How would we do this?

$red = 50;
for ($i = 0; $i < 75; $i++) {
    $red = 50 + ((200 - 50) / 75) * $i;
    //Our color is: 
         // The difference between the limits (150: 200-50)
         // divided by the amount of steps: 75.
         // We multiply the result by the current step.
         // And we add the lower limit to it, so we start at 50.
}

This code will give us:

50 - 52 - 54 - 56 - 58 - ... - 192 - 194 - 196 - 198

Now, let's adapt your code to reflect this:

for($i = 0; $i < $limit; $i++) {
    $mycolors[$i] = imagecolorallocate($im, 
        $r + (($r1 - $r) / $limit) * $i,
        $g + (($g1 - $g) / $limit) * $i,
        $b + (($b1 - $b) / $limit) * $i);

     $mycolors[$i + $limit] = imagecolorallocate($im, 
        $r1 + (($r2 - $r1) / $limit) * $i,
        $g1 + (($g2 - $g1) / $limit) * $i,
        $b1 + (($b2 - $b1) / $limit) * $i);

     //Copy-paste magic here
}