搜索技能/前端美化

前端美化

官方精选开发工具

前端界面美化助手，拒绝千篇一律的 AI 审美。颜色搭配、排版优化、响应式布局、动效建议、组件美化、暗色模式，输出生产级代码。

$npx skills add mindverse/skillhub@frontend-design -g -y

在终端运行即可安装。兼容 Claude Code、Cursor、Windsurf 等支持 Claude Skills 规范的 AI Agent 平台。

▸需要先准备什么？
1) 装 Claude Code（claude.ai/code）。2) 装 ai-skill：`npx skills add 1-SKILL/ai-skill -g -y`。装完上面这条命令再来跑这个 skill 的安装命令。

这个技能能做什么

✓ 反AI审美（禁止紫色渐变白底）
✓ 中文字体推荐
✓ 2026设计趋势
✓ 暗色模式
✓ Tailwind/CSS/React 输出
✓ 响应式布局

怎么用

安装后，直接对你的 AI 助手说：

“帮我美化这个页面”
“界面太丑了怎么办”
“给我一个配色方案”
“做个暗色模式”
▸查看完整 SKILL.md 内容234 chars

前端美化 — UI/UX 增强

基于 Anthropic 官方 frontend-design 技能增强。

六大能力

  1. 颜色搭配（oklch色彩空间）
  2. 排版优化（中文行高 1.8-2.0）
  3. 响应式布局（Container Queries）
  4. 动效建议（View Transitions API）
  5. 组件美化
  6. 暗色模式

中文增强

  • 思源宋体/黑体、霞鹜文楷、阿里巴巴普惠体
  • 中文排版参数
  • 新增中式雅韵风格方向
在 GitHub 查看源文件 →
安全评分
98/100
S级12/12 项检测通过

全部检测通过，可以放心安装

技能信息
代码量242 行
来源官方精选
作者Anthropic
仓库anthropics/claude-code
Stars28,000
分类开发工具
上游anthropics/skills
触发关键词
前端美化UI优化界面美化帮我美化太丑了frontend design

在终端里直接搜技能

安装 ai-skill 后，在 Claude Code 里说需求就能自动匹配技能并一键安装，不用离开终端。

$npx skills add 1-SKILL/ai-skill -g -y

同类技能

代码审查官方精选
S级

AI 代码质量守护者。结构化审查报告，覆盖安全漏洞、性能优化、最佳实践，支持10种编程语言。

React宝典官方精选
A级

React 19+ / Next.js 15+ 最佳实践指南，929行10个章节。覆盖性能优化、Server Components、Hooks、状态管理。

测试驱动官方精选
B级

测试驱动开发助手，红-绿-重构工作流，支持 Jest/Vitest/pytest 等主流测试框架。

快速调试官方精选
A级

快速定位和修复 bug，结构化调试流程：复现→缩小→定位→修复→验证。