All Prompts
All Prompts

call-to-actionsectiontailwindresponsiveiconmarketinglanding
CTA Section with Heading and Two Icon Buttons
Адаптивный CTA-блок Tailwind с заголовком и двумя кнопками-иконками. Призывает к действию: скачать или узнать больше. Идеален для лендингов.
Prompt
<div class="max-w-7xl mx-auto px-6">
<div class="relative overflow-hidden rounded-3xl border border-neutral-200">
<img src="https://hoirqrkdgbmvpwutwuwj-all.supabase.co/storage/v1/object/public/assets/assets/1e4989cc-80c7-45b1-9eb3-3f72b473d778_1600w.jpg" alt="mountain minimal" class="absolute inset-0 h-full w-full object-cover">
<div class="relative bg-black/40">
<div class="sm:px-12 sm:py-20 px-8 py-16">
<div class="max-w-2xl text-white">
<h3 class="text-3xl sm:text-4xl tracking-tight font-sans font-medium" style="">Ready to ship something people
love?</h3>
<p class="mt-3 text-white/80 font-sans">Bring your roadmap. We’ll bring velocity.</p>
<div class="mt-6 flex flex-wrap items-center gap-3">
<a href="#"
class="inline-flex items-center gap-2 rounded-full bg-white text-neutral-900 px-5 py-3 text-sm font-medium hover:bg-neutral-100 font-sans">
Book a discovery call
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
data-lucide="calendar" class="lucide lucide-calendar h-4 w-4">
<path d="M8 2v4"></path>
<path d="M16 2v4"></path>
<rect width="18" height="18" x="3" y="4" rx="2"></rect>
<path d="M3 10h18"></path>
</svg>
</a>
<a href="#"
class="inline-flex items-center gap-2 rounded-full border border-white/50 text-white px-5 py-3 text-sm font-medium hover:bg-white/10 font-sans">
Download overview
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
data-lucide="file-text" class="lucide lucide-file-text h-4 w-4">
<path d="M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z"></path>
<path d="M14 2v4a2 2 0 0 0 2 2h4"></path>
<path d="M10 9H8"></path>
<path d="M16 13H8"></path>
<path d="M16 17H8"></path>
</svg>
</a>
</div>
</div>
</div>
</div>
</div>
</div>