Run StyleSeed Design Gates in Coding-Agent UI Builds
Install StyleSeed skills so coding agents choose a design grammar, build UI with project-local rules, score the result, and verify rendered screens before handoff.
npx skills add agentskillexchange/skills --skill run-styleseed-design-gates-in-coding-agent-ui-builds
npx skills add bitjaru/styleseed, then run the appropriate StyleSeed setup/build workflow such as /ss-setup and /ss-build in Claude Code or $ss-setup and $ss-build in Codex.Use StyleSeed when a coding agent is implementing product UI and needs a repeatable design method rather than another generic generated screen. The operator installs the StyleSeed skills, runs setup to select or compile the project’s design grammar, invokes the build or studio workflow, and requires score plus rendered visual verification before accepting the output. This is not just a design-system or UI-library card: the scope boundary is the agent workflow that resolves rules, builds a screen, scores it, revises failures, and verifies pixels across Claude Code, Codex, Cursor, or compatible skill runners.
What this skill actually does
Inputs and prerequisites: Node.js, npm/npx, Claude Code/Codex/Cursor or compatible skill runner, project build tooling, browser/render verification tooling.
Setup notes: Install from the upstream skill source with npx skills add bitjaru/styleseed , then run the appropriate StyleSeed setup/build workflow such as /ss-setup and /ss-build in Claude Code or $ss-setup and $ss-build in Codex.
Source and verification boundary: use https://styleseed-demo.vercel.app as the canonical reference before running the workflow; keep commands, API calls, CLI usage, and generated outputs reviewable against that upstream source.
Framework fit: publish this as a Multi-Framework workflow only when the operator can invoke the documented toolchain directly, rather than treating the upstream project as a generic product listing.