Is there a way to dynamically apply the 'row-span-y' Tailwind CSS utility class based on a PHP variable in Laravel Blade?

I need to apply the 'row-span-y' Tailwind CSS utility class on a div that is part of a grid-layout based on a PHP variable that has a value between 2 and 16, let's say.

So far, the only possible way that I've found that actually works is doing this:

$variable = 3;
switch ($variable) :
    case 2:
        echo '<div class="row-span-2">';
        break;
    case 3:
        echo '<div class="row-span-3">';
        break;
    case 4:
        echo '<div class="row-span-4">';
        break;
    case 5:
        echo '<div class="row-span-5">';
        break;
...
endswitch;

echo '</div>'

I don't want to do that. What I would like to do instead is:

$variable = 3;
echo '<div class="row-span-' . $variable . '"></div>';

But that doesn't seem to work with Tailwind CSS. The utility class is not recognized.

You could consider using the style attribute, like:

$variable = 3;
echo '<div style="grid-row: span ' . $variable . ' / span ' . $variable . ';"></div>';

Alternatively, since you seem to have knowledge of the exhaustive list of possible values, you could safelist the classes, like:

module.exports = {
  // …
  safelist: [
    { pattern: /^row-span-(1[0-6]|[2-9])$/ },
  ],
  theme: {
    extend: {
      // Add extra row-span-* from 7 to 16 since they do not exist in the
      // default Tailwind configuration.
      gridRow: Object.fromEntries(
        Array(10).fill().map((_, i) => {
          const span = i + 7;
          return [
            `span-${span}`,
            `span ${span} / span ${span}`,
          ];
        }),
      ),
    },
  },
  // …
}