组件 按钮 按钮组件

按钮组件

一个极简主义按钮组件,专为展示作品或产品的作品集设计,具有鲜艳的颜色和支持深色主题的响应式设计,使用Tailwind CSS。

预览

HTML 代码

<div class="flex flex-col items-center justify-center h-screen bg-white dark:bg-gray-900 p-4">
    <h1 class="text-2xl font-bold text-gray-800 dark:text-white mb-6">Portfolio Buttons</h1>
    <div class="space-y-4">
        <a href="#" class="inline-flex items-center justify-center px-6 py-3 text-lg font-medium text-white bg-red-500 rounded hover:bg-red-600 dark:bg-red-700 dark:hover:bg-red-600 transition duration-200">View Projects</a>
        <a href="#" class="inline-flex items-center justify-center px-6 py-3 text-lg font-medium text-white bg-green-500 rounded hover:bg-green-600 dark:bg-green-700 dark:hover:bg-green-600 transition duration-200">Contact Me</a>
        <a href="#" class="inline-flex items-center justify-center px-6 py-3 text-lg font-medium text-white bg-blue-500 rounded hover:bg-blue-600 dark:bg-blue-700 dark:hover:bg-blue-600 transition duration-200">Download CV</a>
    </div>
</div>

相关组件

按钮组件

一个简单的按钮组件,采用材料设计风格,使用单色彩方案并支持黑暗模式,适合商业/企业网站。

打开

Retro_Rainbow_Buttons_Component

专为摄影画廊和作品集设计的复古主题渐变彩虹按钮集合,具有适度的复杂度和完全响应能力,并支持深色模式。

打开

按钮组件

一个响应式按钮组件,支持投资组合的黑暗模式。具有极简的平面设计,采用灰阶,复杂性适中。

打开