#前端
79个Claude Code实战Skill技能库：按12大场景分类打包
前段时间把工作流从 Codex 迁移到了 Claude Code，顺手把手上真正在用的技能理了一遍——不是技能商店里随手截的图，是自己装机目录里、会被反复用到的那些。
一共 79 个，按平时实际会用到的场景分成了 1…
Diagram Design：AI Agent 驱动的图表设计方案，告别模板式排版
用 AI 画结构图，最常见的结果就是一排排整齐的圆角方块——信息没错，但层次不分明、重点平均分配、色彩过于丰富，根本没法直接插入文章或演示文稿。
Diagram Design 的出发点很直接：让 Claude Co…
DiceBear：开源头像生成库，52种风格一行代码搞定用户头像
做带用户系统的产品时，头像是个绕不过去的问题。让用户自己上传，十个有八个懒得弄；准备一套默认头像，用户多了难免撞头像；直接接 Gravatar 等第三方服务，又面临邮箱隐私泄露风险。
核心诉求就一个：让每个用户自动拥有好看、不重复、稳定的…
Hallmark：2.1万Star的AI编程Skill，57道检测关卡告别AI味前端页面设计
用 Claude Code、Codex 等 AI 工具写前端页面，对任何人来说几乎没有了门槛。
只需简单一句话描述需求，几分钟就能拿到一个完整且能部署运行的页面。
但这些页面基本一个样：紫色渐变大标题、所有元素居中、三列圆角图标大卡片。
大…
Hallmark：2 万 Star 的 AI 网页设计 Skill，内置 57 道反套路检测
用 AI 生成网页时，最大的挑战不是实现不了，而是做出来一看就是「AI 做的」。紫青渐变、居中标题按钮、三等分功能卡片——这些元素单独看都没有问题，但组合在一起就变成了 AI 页面的标准模板。更麻烦的是，即使反复修改…
Transitions.dev：27 个开箱即用的 UI 交互动效库，支持 Claude Skills
Transitions.dev 是设计师 Jakub Antalik 开发的 UI 过渡动画库，将最常用的交互动效（下拉菜单、模态框、Toast 提示、骨架屏等）做成可直接复制的 CSS 片段，同时打包成 Claude Skill，安装后即…
Claude Fable 5用Three.js打造3D键盘配置器：交互式电商平台开发实战
MODKEYS 是一个完全运行在浏览器中的 3D 键盘可视化配置器：以 Three.js 作为渲染核心，以 GSAP 驱动动画过渡，将颜色、材质、键帽轮廓、布局与配件等选项直接交给用户操作，实现所见即所得的定制体验。
几年前，做一个这样的交…
Open File Viewer：统一文件在线预览的开源SDK，支持JS/Vue/React/Svelte
开发后台管理系统的人，迟早都会碰到一个需求：附件在线预览。一开始看似简单——图片直接展示，PDF 接个 pdf.js，文本塞进代码编辑器，视频交给浏览器。
真正复杂的是后续：用户开始上传 doc、xls、pptx、w…
Vercel Native SDK：无需浏览器的原生桌面应用框架，6MB 体积 100ms 启动
开发桌面应用时，前端开发者长期面临一个取舍：要生态成熟选 Electron，要轻量高效选 Tauri。现在 Vercel Labs 推出了第三条路线——Native SDK，一个不到 6 MB、无需浏览器运行时的原生…
Vercel 公开 Design.md 教科书级范本：语义化颜色、角色化字号与组件引用规范详解
近期出现了完全通过 AI 制作的网站，家具展示区域支持 360 度拖拽和放大查看细节。
关于 Design.md，给 AI 一份设计规范让它生成代码时有章可循。但实际动手写时，很多人会卡住——不知道写什么、写到什么…