一个基于AI的智能反驳助手,帮你在任何争论中都能占据上风!全新升级的现代化UI界面,提供更优秀的用户体验。
- 毛玻璃效果: 使用backdrop-blur实现现代化的毛玻璃背景
- 渐变色彩: 精心设计的蓝紫色渐变主题,视觉效果更佳
- 响应式布局: 完美适配桌面端、平板和移动设备
- 动态背景: 装饰性的浮动背景元素,增加视觉层次
- 流畅动画: 卡片悬停、按钮点击等交互都有流畅的动画效果
- 智能反馈: 实时字符计数、强度可视化、状态指示器
- 一键复制: 悬停显示复制按钮,支持快速复制回复内容
- 加载状态: 优雅的加载动画和状态提示
- 精准反击: AI分析对方话语,生成针对性回复
- 理性辩论: 保持理性,避免恶意攻击
- 智能升级: 多种语气强度,适应不同场景
- 触摸友好: 按钮和交互元素针对触摸操作优化
- 自适应布局: 在小屏幕设备上自动调整为单列布局
- 性能优化: 减少不必要的重渲染,提升移动端性能
- 前端框架: Next.js 15 + React 19
- 样式方案: Tailwind CSS 4 + 自定义CSS动画
- 图标库: Lucide React
- AI服务: OpenRouter API (DeepSeek Chat)
- 部署平台: Vercel
- 🤖 AI智能分析: 深度理解对方话语的逻辑和意图
- 🎯 多角度反击: 从不同角度生成3个反驳回复
- 🔥 强度调节: 1-10级语气强度,从温和到激烈
- 📋 一键复制: 快速复制生成的回复内容
- 💾 历史记录: 自动保存最近10次的生成记录
- 🛡️ 域名验证: 防止未授权域名访问
- ⚡ 频率限制: 防止API滥用,每分钟最多20次请求
- 🔒 输入验证: 严格的参数验证和内容过滤
- 📊 请求监控: 详细的访问日志和错误追踪
- Node.js 18+
- npm 或 yarn
- 克隆项目
git clone https://github.com/yourusername/argue-win.git
cd argue-win- 安装依赖
npm install
# 或
yarn install- 配置环境变量
cp .env.example .env.local在 .env.local 中配置:
OPENROUTER_API_KEY=your_openrouter_api_key
NEXT_PUBLIC_SITE_URL=https://your-domain.com- 启动开发服务器
npm run dev
# 或
yarn dev- 访问应用
打开浏览器访问
http://localhost:3000
- 主色调: 蓝色到紫色的渐变 (#3b82f6 → #7c3aed)
- 辅助色: 绿色系统状态色 (#10b981)
- 中性色: 灰色系文本和背景 (#f8fafc → #1e293b)
- 卡片悬停: 3D变换 + 阴影变化
- 按钮交互: 缩放 + 颜色过渡
- 加载状态: 旋转动画 + 脉冲效果
- 页面切换: 淡入淡出 + 滑动效果
- 移动端: < 768px (单列布局)
- 平板端: 768px - 1024px (适配布局)
- 桌面端: > 1024px (双列布局)
- 在输入框中描述对方说的话
- 调节语气强度滑块 (1-10)
- 点击"生成反击回复"按钮
- 查看AI生成的3个不同角度的回复
- 点击复制按钮快速复制内容
- 1-3级: 温和理性,适合正式场合
- 4-6级: 适度反击,日常争论使用
- 7-10级: 强力反驳,激烈争论场景
- 描述越详细,AI生成的回复越精准
- 根据场合选择合适的语气强度
- 保持理性讨论,避免恶意攻击
src/
├── app/
│ ├── api/argue/route.ts # API路由
│ ├── globals.css # 全局样式
│ ├── layout.tsx # 根布局
│ └── page.tsx # 主页面
└── components/ # 组件目录 (待扩展)
项目使用Tailwind CSS + 自定义CSS的混合方案:
- 基础样式使用Tailwind类名
- 复杂动画和效果使用自定义CSS
- 响应式设计通过Tailwind断点实现
POST /api/argue
{
"opponentText": "对方说的话",
"intensity": 5 // 1-10的强度值
}- 🎨 全新现代化UI设计
- 🚀 流畅的动画和交互效果
- 📱 完善的移动端适配
- 🎯 功能特色卡片展示
- 💫 毛玻璃效果和渐变背景
- 🔧 优化的代码结构和性能
- 🤖 AI反驳功能
- 🔥 语气强度调节
- 📋 复制功能
- 💾 历史记录
欢迎提交Issue和Pull Request!
- Fork 项目
- 创建特性分支 (
git checkout -b feature/AmazingFeature) - 提交更改 (
git commit -m 'Add some AmazingFeature') - 推送到分支 (
git push origin feature/AmazingFeature) - 开启Pull Request
本项目采用 MIT 许可证 - 查看 LICENSE 文件了解详情
- OpenRouter - 提供AI API服务
- Tailwind CSS - 优秀的CSS框架
- Lucide - 精美的图标库
- Next.js - 强大的React框架