Horizon UI Boilerplate - Default
Tailwind CSS Gradient Button
This is the standard gradient button used throughout our project.
page.tsx
<button
onClick={() => handleCheckout(price)}
className="mx-auto flex w-full items-center justify-center rounded-full bg-boilerplateNavy px-4 py-5 text-sm font-medium text-white duration-[0.2s] hover:shadow-[0px_11px_24px_-13px_rgba(10,_8,_38,_0.50)] active:shadow-[0px_21px_34px_-13px_rgba(10,_8,_38,_0.50)]">
Get started now
<MdChevronRight className="mt-0.5 h-4 w-4" />
</button>