类型:组件 · 分类:按钮 · 收录:2026-09-19 · 源码:会员可见
[hidecontent type="vip1"]<!-- From Uiverse.io by Uncannypotato69 - Tags: skeuomorphism, pink, button, click, hover effect, click effect, tailwindbutton, tailwindcss -->
<button
class="group flex h-fit w-fit flex-col items-center justify-center rounded-full bg-[#F1ddcf] px-[2em] py-[0.5em] shadow-[inset_0px_2px_4px_0px_#f9f1eb,inset_0px_-2px_4px_0px_#e8c8b0,0px_-2px_16px_0px_#e8c8b0,0px_2px_16px_0px_#f9f1eb] duration-200 hover:translate-y-[5%] active:translate-y-[7%] active:shadow-[inset_0px_-2px_4px_0px_#f9f1eb,inset_0px_2px_4px_0px_#e8c8b0,0px_2px_16px_0px_#e8c8b0,0px_2px_16px_0px_#f9f1eb]"
>
<p
class="font-nunito text-[1.5em] font-semibold text-[#d19466] duration-200 group-active:translate-y-[5%]"
>
Button
</p>
</button>
[/hidecontent]