<section class="relative py-44 overflow-hidden">
<div class="container mx-auto px-4">
<div class="flex flex-wrap -m-6">
<div class="w-full lg:w-1/2 p-6">
<div class="lg:max-w-lg">
<h2 class="mb-6 font-heading font-bold text-7xl text-gray-900" >Get maximum results from all your projects.</h2>
<p class="mb-20 text-base text-gray-600" >Amet minim mollit non deserunt ullamco est sit aliqua dolor do amet sint. Velit officia consequat duis enim velit mollit. Exercitation veniam consequat.</p>
<ul>
<li class="mb-4 flex items-center font-heading font-semibold text-lg text-gray-900"><img class="mr-2" src="gradia-assets/elements/hero/check.svg" alt="">
<p >No hidden fees</p>
</li>
<li class="mb-4 flex items-center font-heading font-semibold text-lg text-gray-900"><img class="mr-2" src="gradia-assets/elements/hero/check.svg" alt="">
<p >Start with a free account</p>
</li>
<li class="mb-4 flex items-center font-heading font-semibold text-lg text-gray-900"><img class="mr-2" src="gradia-assets/elements/hero/check.svg" alt="">
<p >Edit online, no software needed</p>
</li>
</ul>
</div>
</div>
<div class="w-full lg:w-1/2 p-6">
<div class="bg-gradient-orange mx-auto max-w-lg h-96 rounded-3xl"><img class="relative top-10 mx-auto transform hover:-translate-y-16 transition ease-in-out duration-500" src="gradia-assets/images/features/dropdown.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
