Cards | Tailwind Templates
Fri Aug 13 2021 21:54:01 GMT+0000 (Coordinated Universal Time)
Saved by
@mtsit
<div class="p-8">
<div class="shadow-xl rounded-lg">
<div style="background-image: url('https://images.pexels.com/photos/814499/pexels-photo-814499.jpeg?auto=compress&cs=tinysrgb&dpr=3&h=750&w=1260')" class="h-64 bg-gray-200 bg-cover bg-center rounded-t-lg flex items-center justify-center">
<p class="text-white font-bold text-4xl">Profile</p>
</div>
<div class="bg-white rounded-b-lg px-8">
<div class="relative">
<img class="right-0 w-16 h-16 rounded-full mr-4 shadow-lg absolute -mt-8" src="http://tailwindtemplates.io/wp-content/uploads/2019/03/link.jpg" alt="Avatar of Jonathan Reinink">
</div>
<div class="pt-8 pb-8">
<h1 class="text-2xl font-bold text-gray-700">Link</h1>
<p class="text-sm text-gray-600">From hyrule</p>
<p class="mt-6 text-gray-700">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris a sem varius, fringilla sapien at, sollicitudin risus.</p>
<div class="flex justify-around mt-8">
<i class="material-icons">chat</i>
<i class="material-icons">duo</i>
<i class="material-icons">location</i>
</div>
</div>
</div>
</div>
</div>
content_copyCOPY
https://tailwindtemplates.io/cards/
Comments