按钮
Soft button with colored shadow, rounded corners, and hover lift
- 基础骨架
font-medium border-0 rounded-2xl transition-all duration-200- 变体
- 主要、次要、轮廓
- 状态
- hover、active、disabled
柔和界面风组件配方
font-medium border-0 rounded-2xl transition-all duration-200 bg-indigo-500 text-white shadow-lg shadow-indigo-500/30 hover:shadow-xl hover:shadow-indigo-500/40 hover:-translate-y-0.5 active:scale-[0.98]卡片
Soft card with large shadow, no border, and rounded corners
- 基础骨架
bg-white border-0 rounded-3xl shadow-xl shadow-gray-200/50 transition-all duration-300- 变体
- 默认、柔和背景、着色
- 状态
- hover
输入框
Soft input with no border, subtle background, and focus ring
- 基础骨架
w-full bg-gray-50 border-0 rounded-2xl text-gray-800 placeholder:text-gray-400 focus:outline-none transition-all duration-200- 变体
- 默认、白色
- 状态
- focus、disabled