buttonctapilltailwindinteractivehoverprimary

Pill-Shaped App Action Button

Кнопка действия в форме таблетки с эффектом размытия и плавным переходом фона при наведении. Идеальна для основного призыва к действию или запуска приложения.

Live Preview

Prompt

<a href="#"
  class="group inline-flex items-center justify-center overflow-hidden transition-all focus:outline-none rounded-full pt-[1px] pr-[1px] pb-[1px] pl-[1px] relative">
  <span class="absolute inset-[-1000%] animate-[spin_3s_linear_infinite] bg-[conic-gradient(from_90deg_at_50%_50%,#333_0%,#fff_50%,#333_100%)]"></span>
  <span class="inline-flex cursor-pointer items-center justify-center hover:bg-neutral-900 transition-colors text-xs font-medium text-white bg-neutral-950 w-full h-full rounded-full pt-2 pr-5 pb-2 pl-5 backdrop-blur-3xl">
              Open App
            </span>
</a>

All Prompts