#f1f5f9
1<div class="group w-[190px] overflow-hidden rounded-2xl bg-white shadow-xl shadow-slate-900/10 ring-1 ring-slate-200 transition duration-300 hover:-translate-y-1 hover:shadow-2xl">2 <div class="h-16 bg-gradient-to-br from-amber-300 via-rose-400 to-violet-500 bg-[length:200%_200%] bg-left-top transition-all duration-700 group-hover:bg-right-bottom"></div>3 <div class="-mt-8 px-4 pb-4">4 <div class="grid size-16 place-items-center rounded-full border-4 border-white bg-gradient-to-br from-sky-400 to-indigo-500 text-lg font-bold text-white transition duration-300 group-hover:rotate-6">LC</div>5 <p class="mt-2 font-semibold text-slate-900">Luísa Campos</p>6 <p class="text-xs text-slate-500">Ilustradora · Recife</p>7 <div class="mt-3 flex gap-2">8 <button class="flex-1 rounded-lg bg-slate-900 py-1.5 text-xs font-semibold text-white transition hover:bg-slate-700">Seguir</button>9 <button class="grid size-8 place-items-center rounded-lg border border-slate-200 text-slate-600 transition hover:bg-slate-100">10 <svg class="size-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg>11 </button>12 </div>13 </div>14</div>