<section class="py-24 md:py-36" style="background: url('fily-assets/gradients/gradient-header.jpg'); background-size: cover;">
<div class="container mx-auto px-4">
<div class="pt-20 xl:pt-32 bg-black overflow-hidden rounded-3xl">
<div class="flex flex-wrap">
<div class="w-full lg:w-1/3 xl:w-1/2 mb-16 md:mb-0">
<div class="px-10 md:pb-16 max-w-lg mx-auto">
<h2 class="mb-6 font-heading text-3xl md:text-4xl text-white">Get mobile app</h2>
<p class="mb-14 text-xl text-gray-500 font-medium leading-relaxed">Nullam dignissim diam sed velit molestie, at auctor lectus finibus. Phasellus risus nisl, cursus dictum orci a, fermentum finibus tellus.</p>
<a href="#" class="inline-flex justify-center items-center text-center h-18 py-6 px-10 font-semibold text-white hover:text-white focus:text-white bg-blue-500 hover:bg-blue-600 focus:bg-blue-600 rounded-full focus:ring-4 focus:ring-blue-200 transition duration-200">Download app</a>
</div>
</div>
<div class="w-full lg:w-2/3 xl:w-1/2 self-end">
<img class="mx-auto xl:ml-0 object-cover transform hover:scale-105 transition duration-500" style="height: 476px;" src="fily-assets/faq/iphone.png" alt="">
</div>
</div>
</div>
</div>
</section>
Can't find the right component?
Describe it and Shuffle AI builds it in seconds, ready to edit and export.
Free to start
Generate with AI
