How to create gradient border with Tailwind CSS

Give me the code

    <div class="relative rounded-2xl p-8">
        <div class="absolute -inset-px bg-gradient-to-r from-yellow-400 to-pink-400 rounded-2xl" aria-hidden="true"></div>
        <div class="absolute inset-0 bg-zinc-900 rounded-2xl" aria-hidden="true"></div>
        <div class="z-10 text-zinc-100">Nice border around me!</div>
    </div>

Explain

First we have a div that has a p-8 for it's content.

What is behind it is a div that is position absolute and has -inset-px, meaning it is the same size as the parent div but 1px outside of it. This is the gradient border. It has a bg-gradient-to-r class that makes it a gradient from left to right. The from-yellow-400 and to-pink-400 classes are the colors of the gradient.

Then there is the second div that is also position absolute and has inset-0 class. This is the background color.

Enjoy ✌🏻