按钮
Stripe-inspired button with rounded-full, gradient, refined shadow and white text
- 基础骨架
font-semibold rounded-full transition-all duration-200- 变体
- 主要、次要、轮廓
- 状态
- hover、active、disabled
Stripe 风格组件配方
font-semibold rounded-full transition-all duration-200 bg-gradient-to-r from-[#635BFF] to-[#7A73FF] text-white shadow-[0_4px_14px_rgba(99,91,255,0.4)] hover:shadow-[0_6px_20px_rgba(99,91,255,0.5)] hover:brightness-110 active:scale-[0.98]卡片
Stripe-inspired card with white background, rounded corners and generous padding
- 基础骨架
bg-white rounded-xl transition-all duration-200- 变体
- 默认、强调、渐变
- 状态
- hover
输入框
Clean Stripe-style input with rounded corners and refined focus ring
- 基础骨架
w-full bg-gray-50 rounded-lg border border-gray-300 text-gray-900 placeholder:text-gray-400 focus:outline-none transition-all duration-200- 变体
- 默认、白色
- 状态
- focus、disabled