<section class="pt-12 md:pt-24 pb-14" style="background: linear-gradient(131deg, #E8E5FE 26.82%, #FFEED8 96.89%);">
<div class="container mx-auto px-4">
<h1 class="text-center text-neutral-800 text-5xl sm:text-6xl md:text-7xl font-semibold mb-8 font-heading">Join the community, subscribe now</h1>
<p class="text-center text-neutral-500 text-xl font-medium mb-16">Shape Tomorrow with Digital Learning Today!</p>
<form class="mb-16 md:mb-36 max-w-2xl mx-auto" action="#">
<div class="flex flex-wrap -m-2">
<div class="w-full sm:flex-1 p-2">
<input class="w-full px-8 py-5 outline-none rounded-lg border border-neutral-100 placeholder-neutral-600 font-medium focus:ring-4 focus:ring-neutral-100 transition duration-200" type="text" placeholder="Your Email">
</div>
<div class="w-full sm:w-auto p-2">
<button class="flex justify-center items-center text-center h-full w-full p-5 font-semibold tracking-tight text-lg text-white bg-neutral-900 hover:bg-neutral-800 focus:bg-neutral-800 rounded-lg focus:ring-4 focus:ring-neutral-400 transition duration-200" type="submit">Join now</button>
</div>
</div>
</form>
<p class="text-center text-neutral-600 text-sm font-medium tracking-tight">Get the ideas, tools and tips you need to grow your sound straight.</p>
</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
