Home > Tailwind Components > Buttons
Tailwind CSS Buttons
Hubspot Button
<button class="bg-[#ff5c35] hover:bg-[#e04826] active:bg-[#b3361d] font-bold text-white flex h-8 lg:h-11 items-center px-4 rounded-md shrink-0 text-nowrap whitespace-nowrap text-sm lg:text-lg">
Get a demo
</button>
Reddit Button
<button class="bg-[#D93900] hover:bg-[#AE2C00] font-bold text-white flex h-10 items-center px-4 rounded-full shrink-0 text-nowrap whitespace-nowrap text-sm lg:text-lg">
Get a demo
</button>
Facebook Button
<button class="bg-[#42b72a] hover:bg-[#36a420] active:bg-[#2b9217] text-white px-4 leading-[48px] font-bold inline-block text-center align-middle text-lg text-nowrap whitespace-nowrap rounded-md">
Create new account
</button>
Youtube Button
<button class="bg-[#0f0f0f] hover:bg-[#272727] font-medium text-white leading-[36px] flex items-center justify-center h-9 rounded-[18px] px-4 shrink-0 text-nowrap whitespace-nowrap text-sm">
Subscribe
</button>
Amazon Button
<div class="w-40">
<button class="rounded-lg bg-[#ffd814] border border-[#fcd200] text-[#0f1111] text-[13px] leading-[29px] pr-[11px] pl-[10px] h-[29px] inline-block text-center align-middle shadow-[0_2px_5px_0_rgba(213,217,217,0.5) w-full">
Shop now
</button>
</div>