返回

文章详情

Show HN: StyleSeed – 一个设计规则引擎,让AI代理停止构建通用UI

Hacker News2026年7月15日 13:55

您的AI写出的UI看起来像是AI写的。StyleSeed是解决这个问题的设计引擎。为Claude Code · Codex · Cursor · vibe coding提供设计判断——使输出不再看起来像是生成的。一个组件。三个品牌DNA。相同的聊天UI在Toss · Raycast · Arc之间变形——颜色、半径、运动、阴影、渐变都由StyleSeed令牌驱动。只是一个数据皮肤属性。每项设计AI技能都能让您的UI保持一致。StyleSeed还对抗通用的AI外观——并强制执行。判断,而非数据——这是设计师的思维方式,而不是调色板收集;抵制AI的痕迹——默认的靛蓝色、图标芯片陈词滥调、模板布局、彩虹列表;一个评分质量门——在您看到之前进行审查+修复,达到≥80/100;每个代理——发布CLAUDE.md + AGENTS.md + .cursorrules;一个阻滞设计漂移的设计锁;免费和MIT许可 完整页面:之前 · 之后 · 更多之前/之后→🔥我们将这个页面的早期版本通过了我们自己的质量门。它得分58/100→这是收据 相同的产品,六种样式——每个仅需/ss-restyle <preset>即可。连贯、独特,从不通用。开始使用 · 引擎 + 皮肤 · 运动 · 技能 · 维基 · 한국어在30秒内开始使用 最快速的方法——将这句话粘贴到Claude Code、Codex、Cursor或任何AI代理中。它会安装StyleSeed并运行整个循环:安装StyleSeed以确保其检查实际运行:`npx skills add bitjaru/styleseed`(如果无法运行,请参考https://styleseed-demo.vercel.app/llms-full.txt)。然后在此项目中的每个UI中使用它。首先,在计划模式中,锁定我的关键颜色、字体和运动并保存到STYLESEED.md,以便它们不漂移。按照规则构建,保持一个焦点和一个强调色。在向我展示任何内容之前,运行质量门(`/ss-score`在Claude Code中,`$ss-score`在Codex中)达到≥80并修复失败的内容。对于全屏,运行`/ss-build`在Claude Code中或`$ss-build`在Codex中——它强制执行整个循环。为什么先安装提示:质量门是使输出不再看起来通用的步骤——但ss-score和ss-build技能只能在安装后运行。仅指向代理指向规则URL时,“门”降级为通常跳过的诚信系统自检。安装使循环变为现实:锁定保持在STYLESEED.md中(无漂移),并且门实际上在您看到任何内容之前进行评分和修复。无法安装?URL仍然教授规则——只是效果较弱。适用于Claude Code (CLAUDE.md)、Codex / Amp / Gemini CLI (AGENTS.md)和Cursor (.cursorrules)——StyleSeed同时提供这三者。(最初计划是防止结果看起来随机——见疑难解答。)您的代理在加载StyleSeed时实际做的事情:您▸为我构建一个计费设置页面代理▸(计划模式)关键色?对于计费,我会选择深青色——#0F766E,心情:尖锐·平静·可信赖(不是默认的靛蓝色)。运动:瞬间。好吧?▸是代理▸✓写入STYLESEED.md——皮肤、强调色、字体、半径、运动锁定,重新读取每个提示代理▸构建中……在我向您展示任何内容之前运行质量门▸✗两个强调色✗“正常”行着色✗没有空状态→修复代理▸✓88/100——一个强调色,正常状态为灰色,真正的空/错误状态。这里是页面。STYLESEED.md锁是阻止漂移的机制。您的皮肤、关键颜色、半径和运动被写入一次,规则使每个代理在每个提示上重新读取并遵守它们——因此设计在每个会话中不再不同。质量门随后自我审查并修复UI(彩虹列表、两个强调色、缺失状态),在您看到之前——而且它也可以为旧的通用构建进行改造。规则是产品——它们不需要安装或权限。它们是普通的Markdown(CLAUDE.md / AGENTS.md / DESIGN-LANGUAGE.md),所以上面的提示——或者仅仅复制那些文件——就是90% StyleSeed,无需批准。想要19个ss-*代理技能吗(可选自动化:设置向导、审查、评分)?npx skills add bitjaru/styleseed 安装所有19个技能到Claude Code、Codex、Cursor、Gemini CLI、Amp等。然后在Claude Code中运行/ss-setup或在Codex中运行$ss-setup(您也可以从Codex的/skills选择它)。您的代理可能会要求您在首次使用时批准工具。无法安装?规则本身仍然可以做核心工作。您的代理、确切路径:您的代理读取最快的安装Claude Code CLAUDE.md + /ss-*技能 npx skills add bitjaru/styleseed Cursor .cursorrules cp engine/.cursorrules .cursorrules——或粘贴上面的提示Codex AGENTS.md + $ss-*技能(.agents/skills)npx skills add bitjaru/styleseed Amp · Gemini CLI AGENTS.md + 技能npx skills add bitjaru/styleseed Windsurf · Copilot · 任何其他的粘贴并前往上面的提示没有安装——粘贴并走 更多路径(手动复制、Cursor、awesome-design-md品牌)在下面的手动安装中。这个项目是为谁准备的?您要求Claude Code或Cursor构建一个仪表板,结果却显得业余;您正在进行一个SaaS应用程序的vibe编码,不想雇一个设计师;您使用shadcn/ui,但输出……

赞助内容

NordVPN Next-gen Antivirus

本站免费、广告极少。如果觉得有帮助,可以请我们喝杯咖啡 —— 任何金额都对持续运营有实际帮助。

请我喝杯咖啡