Градиентная граница с прозрачным содержимым?

Question

[AlexCruel]

Пример градиентной границы с непрозрачным содержимым:

<button class="bg-gradient-to-r from-blue-500 to-purple-500 text-white font-semibold rounded p-1">
      <span class="flex w-full bg-blue-800 text-white rounded p-2">
          Gradient border
      </span>
    </button>

Вопрос: как сделать, чтобы граница осталась градиентной, но фон содержимого был прозрачным?

Answer 1

[Антон Антон]

Сделать границу с помощью фонового svg с толщиной обводки, не зависящей от растягивания https://developer.mozilla.org/en-US/docs/Web/SVG/A...