Get 1 out of all possible values after X arrays combinations in PHP to generate random CSS classes values

I found an interesting post here where they combined 3 arrays in all possible ways and I found that function very useful as I used to generate not just random combinations of colours/effects for my websites but even keyword combinations (service/product + locations in SEO).

https://i.imgur.com/cC85JrZ.jpg

The thing is that I would love to call the function to get 1 of the generated random values for the $superbuttons in the simplest way knowing that all the arrays will be stored in a setting/config file, in this way:

$colours = array('white', 'red', 'orange', 'black', 'gray', 'yellow', 'green', 'pink', 'rosy', 'magenta');
$effects = array('slide-in-elliptic-bottom-fwd', 'bounce-in-fwd', 'slide-in-blurred-top', 'wobble-hor-bottom', 'bounce-top', 'bounce-bottom', 'tracking-in-expand', 'puff-in-center', 'text-focus-in');

The code I'm actually using is:

    $colours = array('white', 'red', 'orange', 'black', 'gray', 'yellow', 'green', 'pink', 'rosy', 'magenta');
$effects = array('slide-in-elliptic-bottom-fwd', 'bounce-in-fwd', 'slide-in-blurred-top', 'wobble-hor-bottom', 'bounce-top', 'bounce-bottom', 'tracking-in-expand', 'puff-in-center', 'text-focus-in');

function combination($superbuttons, $str = '') {
   $current = array_shift($superbuttons);
   if(count($superbuttons) > 0) {
       foreach($current as $element) {
           combination($superbuttons, $str.$element);          
       }
   }
   else{
       foreach($current as $element) {
           echo '<a href="#" class="button '.$str.' '.$element .'" style="animation-delay: '.rand(3,20).'00ms;">'.$str.' '.$element.'</a>';       
       }
    }

}

$superbuttons = array($colours,$effects);
shuffle($superbuttons);
$total = 1;
foreach($superbuttons AS $theyare) $total = $total * count($theyare);
combination($superbuttons);

echo '<hr>';

$colourstring = implode(",", $colours);
$effectstring = implode(",", $effects);

$manycolours= str_word_count($colourstring, 0);
$manyeffects = str_word_count($effectstring, 0);

$hmanywords = max($manycolours, $manyeffects); 

$expresions = explode (',',$colourstring);
shuffle($expresions);
$selection = array_slice($expresions, 0, $hmanywords);
$EffectList = array_unique($selection);

foreach($EffectList as $effect){        
$thelink = substr($effect, 1);
$asresult = ltrim($thelink);

$randomTitles = explode (',',$effectstring);
shuffle($randomTitles);
$selection2 = array_slice($randomTitles, 0, $hmanywords);
$ColourList = array_unique($selection2);

$servicios_limpio = $randomTitles[rand(3,count($randomTitles)-1)];
$servicio = substr($servicios_limpio,1);

$supereffect = $servicios_limpio. ' ' .$effect;
echo '<a  href="#" class="button '.$supereffect.'" title="'.$supereffect.'" style="animation-delay: '.rand(3,20).'00ms;">button '.$supereffect.'</a>';
}

Love to hear how to clean/improve the code and get that value.

I add the code to randomize some styles on my sites, maybe would be better a random function on javascript that could also add the class to specific elements so for <a class="button"> change the class to <a class="button colour effect">.

Any ideas?

Cheers!