mcpField
S
styleseed

styleseed

github.com/podoDesign & UI30166 installsUpdated 4d ago
Repository

About styleseed

styleseed is a skill that turns recorded design decisions into project-specific rules and implementation workflows. It is for teams building or updating interfaces, and keeps decisions in STYLESEED.md and a compiled rule bundle for reuse across screens and sessions.

Key features

  1. 01Record design decisions in STYLESEED.md
  2. 02Compile project rules into .styleseed/
  3. 03Workflows for building, reviewing, and auditing UI
  4. 04Render-and-score quality gate
  5. 05Token, accessibility, motion, and microcopy workflows

Use cases

  1. 01Preserve design choices across new screens
  2. 02Apply project rules while implementing UI
  3. 03Review and score rendered interfaces
  4. 04Update design tokens or accessibility guidance

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/podo/design-agent-skills --skill styleseed

After installing, type/styleseedin Claude Code to confirm it loaded.

Bundled filesstub.yaml

Details

From the project README

styleseed

Catalogue stub — full skill: bitjaru/styleseed

Decision tree

  1. Is the full skill already installed?

    • Global: f=~/.agents/skills/styleseed/SKILL.md; [ -f "$f" ] && ! grep -q "^das:" "$f" && echo "installed" || echo "pointer"
    • Project: f=.agents/skills/styleseed/SKILL.md; [ -f "$f" ] && ! grep -q "^das:" "$f" && echo "installed" || echo "pointer"
    • installed → the skill is installed as styleseed, invoke it and proceed
    • pointer → go to step 2

  2. Detect scope, then install:

    [ -e ~/.agents/skills/styleseed ] && echo "global" || echo "project"

    Global:

    npx skills add bitjaru/styleseed --skill styleseed -g -y

    Project:

    npx skills add bitjaru/styleseed --skill styleseed -y

    Claude Code: send a command as a chat message starting with ! to run it without leaving the conversation.

Claude Code plugin route:

claude plugin marketplace add bitjaru/styleseed
claude plugin install styleseed@styleseed

Heads-up

  • Requires: Node.js and npm (the skill's bundled context compiler and quality gates run as Node scripts); Writes STYLESEED.md (a design lock) and a .styleseed/ directory into your project when its setup and build workflows run
  • License: MIT
  • Download size: ~77 MB.

Invoke after install

  • Skill name: styleseed (the only registered skill)
  • Claude Code: /styleseed <request>, for example /styleseed Help improve this screen. Preserve our existing design choices.; Codex: $styleseed <request>
  • Name the workflow in the request: /styleseed setup, /styleseed resolve, /styleseed build, /styleseed review, /styleseed score, /styleseed verify, /styleseed tokens. The former separate /ss-* commands (for example /ss-build, /ss-tokens) are now internal workflows of this one skill.

What it does

StyleSeed turns recorded design decisions into project-local rules and implementation workflows. The single styleseed skill picks one internal workflow from your request (setup, studio, reference, build, audit, review, score, verify, restyle, tokens, motion, accessibility, microcopy, flows, states, update) and applies the rules that fit the task. Setup writes a STYLESEED.md design lock (skin, key colour, radius, motion) so decisions survive new screens and sessions; a context compiler turns it into a small rule bundle under .styleseed/, and a render-and-score quality gate reviews the UI before it is shown to you. Skins are inspired-by token sets that restyle the same components. A score supports, but does not replace, human design acceptance.

When NOT to use

  • Component library without token/rule context — use shadcn-ui or baseline-ui
  • Design token architecture only — use design-tokens-skill
  • Single-page design review — use design-review-garrytan or design-auditor

Comments

Markdown supported