Add bg-mosh / Custom Gradient Type Support

[ANTIPIMP]

I’m building an AI-powered website builder and wanted to use a mosh gradient as the background to give it that futuristic, AI-driven look. The challenge is that in TailwindCSS v4, gradients are limited to linear, radial, and conic — there’s no built-in support for a mosh-style gradient.

Ideally, Tailwind should allow something like:

html
class="bg-mosh from-red-500 via-slate-400 via-40% to-blue-300 to-90%"
which would then compile to:

css
.bg-mosh {
background-image: radial-gradient(var(--tw-from), var(--tw-via), var(--tw-to));
}
That way, developers could define a custom gradient type (bg-mosh) with flexible stops and colors, just like the existing gradient utilities.

[vedant476]

Tailwind CSS v4 already supports custom utilities through @utility, so you can create a custom bg-mosh utility yourself:

@utility bg-mosh {
  background-image: radial-gradient(var(--tw-gradient-stops));
}

Then use it like:

<div class="bg-mosh from-red-500 via-slate-400 via-40% to-blue-300 to-90%">

However, Tailwind does not currently provide a built-in mechanism for defining a new gradient type that automatically integrates with its existing from-*, via-*, to-*, and stop-position utilities in the same way as bg-linear-*, bg-radial, and bg-conic-*.

So the proposed feature would be about making the existing gradient-stop system extensible to custom gradient types, rather than simply adding another gradient utility.