Explorer
project
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<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="max-w-3xl w-full">
<div class="rounded-2xl bg-white ring-1 ring-slate-200 p-6 shadow-sm">
<p class="text-xs font-medium uppercase tracking-wider text-indigo-600">Responsive</p>
<h3 class="mt-2 text-xl sm:text-2xl md:text-3xl font-semibold tracking-tight">Scales with your viewport</h3>
<div class="mt-5 grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3">
<div class="rounded-xl bg-slate-50 ring-1 ring-slate-100 p-4 text-sm">Mobile</div>
<div class="rounded-xl bg-slate-50 ring-1 ring-slate-100 p-4 text-sm">Tablet</div>
<div class="rounded-xl bg-slate-50 ring-1 ring-slate-100 p-4 text-sm">Laptop</div>
<div class="rounded-xl bg-slate-50 ring-1 ring-slate-100 p-4 text-sm">Desktop</div>
</div>
</div>
</div>
</div>
rloop.dev/p/Pr-Y80