Explorer
project
index.html
1
2
3
4
5
6
7
8
9
10
11
<div class="min-h-screen bg-gradient-to-br from-slate-50 via-white to-indigo-50/40 font-sans text-slate-900 antialiased p-8 flex items-center justify-center">
<div class="relative max-w-md w-full h-64 bg-white ring-1 ring-slate-200 rounded-2xl shadow-sm overflow-hidden">
<div class="absolute top-4 left-4 px-3 py-1 rounded-full bg-slate-900 text-white text-xs font-medium">top-left</div>
<div class="absolute top-4 right-4 h-8 w-8 rounded-full bg-indigo-600 ring-4 ring-white shadow-lg"></div>
<div class="absolute bottom-0 left-0 right-0 p-4 bg-gradient-to-t from-white via-white/90 to-transparent">
<p class="text-sm font-medium">Absolutely positioned overlay</p>
<p class="text-xs text-slate-500">Anchored to the bottom edge</p>
</div>
<div class="absolute inset-0 -z-10 bg-gradient-to-br from-indigo-50 to-violet-50"></div>
</div>
</div>
rloop.dev/p/Pr-D98