<body>
<section
class="flex flex-col items-center justify-center min-h-screen w-full bg-gradient-to-br from-sky-100 to-sky-400 p-6">
<div class="max-w-sm w-full bg-white rounded-xl shadow-xl flex flex-col items-center gap-4 overflow-hidden">
<div class="h-48 bg-gray-200 w-full flex justify-center relative mb-40"><img
src="https://e0.pxfuel.com/wallpapers/981/781/desktop-wallpaper-windows-11-blue-stock-official-ultra-windows-11.jpg"
class="w-full h-full object-cover">
<div class="flex flex-col absolute top-24 gap-4">
<div class="w-48 h-48 rounded-full bg-gray-200 overflow-hidden border-8 border-white"><img
src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcTATgQfiBMO4H8n-6ZYYw8bzocBjQ2miUgdp05o3YwO21DeKDGd"
class="w-full h-full object-cover"></div>
<div class="flex flex-col items-center">
<p class="text-2xl font-bold">Bill Gates</p>
<p class="text-sm font-semibold">@bill_gates</p>
</div>
</div>
</div>
<div class="flex flex-col gap-4 w-full px-8 py-4"><a href="#"
class="bg-sky-600 text-white font-semibold rounded-lg px-6 h-12 flex items-center justify-center w-full hover:opacity-80">Instagram</a><a
href="#"
class="bg-sky-600 text-white font-semibold rounded-lg px-6 h-12 flex items-center justify-center w-full hover:opacity-80">Twitter</a><a
href="#"
class="bg-sky-600 text-white font-semibold rounded-lg px-6 h-12 flex items-center justify-center w-full hover:opacity-80">Facebook</a>
</div><a href="#"
class="bg-gradient-to-br from-sky-100 to-sky-400 h-32 w-full flex items-center justify-center group overflow-hidden"><img
src="https://miro.medium.com/v2/resize:fit:2000/1*WE_pJonC9b3hp7MEWLHYtQ.png"
class="w-full h-full object-cover group-hover:scale-105 transition ease-in-out"></a>
<div class="flex text-2xl items-center gap-2 pb-4"><a href="#"
class="hover:-translate-y-1 transition ease-in-out p-2 bg-sky-600 text-white w-12 h-12 rounded-full flex items-center justify-center"><i
class="fab fa-twitter"></i></a><a href="#"
class="hover:-translate-y-1 transition ease-in-out p-2 bg-sky-600 text-white w-12 h-12 rounded-full flex items-center justify-center"><i
class="fab fa-linkedin"></i></a><a href="#"
class="hover:-translate-y-1 transition ease-in-out p-2 bg-sky-600 text-white w-12 h-12 rounded-full flex items-center justify-center"><i
class="fab fa-facebook"></i></a></div>
</div>
</section>
</body>Welcome to SenangStart Template Preview! 🎉 Visit our homepage for a deeper dive into our offerings, or you can edit this template with drag-n-drop website builder.
Edit Template