Kinetic Component Library

CTA: Card with Button 

<div class="border border-dark/10 rounded flex flex-col overflow-hidden">
    <div class="flex-1 p-6 sm:p-10 space-y-6 text-center text-dark">
        <h3 class="text-3xl font-bold">Kinetic Halo</h3>
        <div class="text-lg">Get 24/7 access to a team of experts for confidential support when you need it. Call 0800 123456.
        </div>
    </div>
    <a href="#" class="bg-primary flex px-6 py-5 text-light text-lg font-bold justify-center hover:bg-opacity-90 focus:outline-none focus:ring-0 focus:underline focus:underline-offset-4">Visit kinetic-halo.co.uk</a>
</div>
 
<div class="border border-dark/10 rounded flex flex-col overflow-hidden">
	<div class="flex-1 p-6 sm:p-10 space-y-6 text-center text-dark">
		<h3 class="text-3xl font-bold">Kinetic Halo</h3>
		<div class="text-lg">Get 24/7 access to a team of experts for confidential support when you need it. Call 0800 123456.
			</div>
	</div>
	<a href="#" class="bg-{{color}} flex px-6 py-5 text-light text-lg font-bold justify-center hover:bg-opacity-90 focus:outline-none focus:ring-0 focus:underline focus:underline-offset-4">Visit kinetic-halo.co.uk</a>
</div>
 
{
  "image": "https://picsum.photos/640/480?random=1",
  "left": true,
  "right": true,
  "color": "primary"
}

No notes defined.