All Prompts
All Prompts

ctaherotailwindresponsivelandingsaasmarketingsection
Neural Stack CTA Section with Background Image
Секция CTA с фоновым изображением для SaaS/AI. Преобразует пользователей с помощью заголовка, кнопок и статистики. Адаптивный дизайн.
Prompt
<section class="overflow-hidden bg-center bg-neutral-950 bg-[url(https://hoirqrkdgbmvpwutwuwj.supabase.co/storage/v1/object/public/assets/assets/21844782-ee2e-4575-a666-31b6edd04644_3840w.jpg)] bg-cover border-neutral-200 border-t pt-20 pb-16 relative">
<div class="absolute top-0 right-0 bottom-0 left-0"></div>
<div class="container mx-auto px-6 lg:px-12 relative z-10">
<div class="max-w-3xl mx-auto text-center">
<div class="inline-flex bg-gradient-to-b from-white/10 to-white/0 rounded-full mb-6 pt-1 pr-4 pb-1 pl-4 backdrop-blur-lg gap-x-2 gap-y-2 items-center" style="position: relative; --border-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.1)); --border-radius-before: 9999px">
<span class="iconify text-neutral-300" data-icon="solar:flash-circle-bold-duotone"></span>
<span class="text-[11px] uppercase font-medium text-gray-950 tracking-[0.18em]">
Launch in days, not quarters
</span>
</div>
<h2 class="text-4xl lg:text-5xl font-medium tracking-tight text-white leading-[1.05] mb-4">
Ready to operationalize your neural stack?
</h2>
<p class="text-base text-neutral-300 max-w-2xl mx-auto mb-10">
Join over <span class="font-medium text-white">180</span> teams orchestrating models, data, and governance through a single, production‑ready control plane.
</p>
<div class="flex flex-col sm:flex-row items-center justify-center gap-4">
<button class="group inline-flex items-center justify-center rounded-full bg-white text-neutral-900 text-sm font-medium px-6 py-3 shadow-[0_18px_45px_-24px_rgba(15,23,42,0.7)] hover:bg-neutral-100 transition-all">
Start sandbox workspace
<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" data-icon="solar:arrow-right-up-bold-duotone" class=""><path fill="currentColor" fill-rule="evenodd" d="M17.47 15.53a.75.75 0 0 0 1.28-.53V6a.75.75 0 0 0-.75-.75H9a.75.75 0 0 0-.53 1.28z" clip-rule="evenodd" class=""></path><path fill="currentColor" d="M5.47 17.47a.75.75 0 1 0 1.06 1.06l6.97-6.97l-1.06-1.06z" opacity=".5" class=""></path></svg>
</button>
<button class="inline-flex hover:border-neutral-400 hover:text-white transition-colors xl:text-slate-50 text-sm font-medium bg-gradient-to-b from-white/10 to-white/0 rounded-full pt-3 pr-6 pb-3 pl-6 shadow-[0_2.8px_2.2px_rgba(0,_0,_0,_0.034),_0_6.7px_5.3px_rgba(0,_0,_0,_0.048),_0_12.5px_10px_rgba(0,_0,_0,_0.06),_0_22.3px_17.9px_rgba(0,_0,_0,_0.072),_0_41.8px_33.4px_rgba(0,_0,_0,_0.086),_0_100px_80px_rgba(0,_0,_0,_0.12)] backdrop-blur-xl items-center justify-center" style="position: relative; --border-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0)); --border-radius-before: 9999px">
Book a 20‑minute runbook review
</button>
</div>
<div class="flex flex-wrap gap-4 text-xs text-neutral-500 mt-8 gap-x-4 gap-y-4 items-center justify-center">
<div class="inline-flex items-center gap-2">
<span class="w-1.5 h-1.5 rounded-full bg-emerald-400"></span>
<span class="text-white/70">Median go‑live in 12 days</span>
</div>
<span class="hidden sm:inline text-neutral-700">•</span>
<div class="inline-flex items-center gap-1">
<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" data-icon="solar:star-bold-duotone" class="">
<path fill="currentColor" d="M18.483 16.767A8.5 8.5 0 0 1 8.118 7.081a1 1 0 0 1-.113.097c-.28.213-.63.292-1.33.45l-.635.144c-2.46.557-3.69.835-3.983 1.776c-.292.94.546 1.921 2.223 3.882l.434.507c.476.557.715.836.822 1.18c.107.345.071.717-.001 1.46l-.066.677c-.253 2.617-.38 3.925.386 4.506s1.918.052 4.22-1.009l.597-.274c.654-.302.981-.452 1.328-.452s.674.15 1.329.452l.595.274c2.303 1.06 3.455 1.59 4.22 1.01c.767-.582.64-1.89.387-4.507z" class="">
</path>
<path fill="currentColor" d="m9.153 5.408l-.328.588c-.36.646-.54.969-.82 1.182q.06-.045.113-.097a8.5 8.5 0 0 0 10.366 9.686l-.02-.19c-.071-.743-.107-1.115 0-1.46c.107-.344.345-.623.822-1.18l.434-.507c1.677-1.96 2.515-2.941 2.222-3.882c-.292-.941-1.522-1.22-3.982-1.776l-.636-.144c-.699-.158-1.049-.237-1.33-.45c-.28-.213-.46-.536-.82-1.182l-.327-.588C13.58 3.136 12.947 2 12 2s-1.58 1.136-2.847 3.408" opacity=".5" class=""></path>
</svg>
<span class="font-medium text-neutral-200">4.96</span>
<span class="text-white/70">implementation CSAT</span>
</div>
</div>
</div>
</div>
</section>