粗野主义返回顶部按钮

一个在Tailwind CSS中具有高对比度、大胆排版和锐利边缘的粗犷风格返回顶部按钮。包括响应式大小和暗模式支持。

预览

HTML 代码

<button class="fixed bottom-5 right-5 bg-black text-lime-400 border-4 border-lime-400 p-4 text-xl font-bold uppercase transition-all duration-300 hover:bg-lime-400 hover:text-black dark:bg-lime-400 dark:text-black dark:border-black dark:hover:bg-black dark:hover:text-lime-400">
    TOP
</button>

相关组件

拟物化返回顶部按钮

一个拟物化的“Back to Top”按钮，专为商业/公司网站设计，采用温暖的中性色，具有响应式设计和深色模式支持。该按钮具有 3D 按下效果。

打开

Back to Top Button 组件

响应式“Back to Top”按钮，具有 Material Design 美学、单色配色方案和深色模式支持。它在右下角显示为浮动作按钮（FAB）。

打开

Art Deco 返回顶部按钮

具有装饰艺术风格的“Back to Top”按钮组件，具有几何图案和温暖的日落色，适用于约会/社交平台。它包括丰富的交互式样式并支持深色模式。

打开