Measured on 120 rendered benchmark cells: the enforced gate improved both Codex and Claude Code by +5.3 points. Raw rules alone were inconsistent (Codex +1.6, Claude Code −3.7), which is why StyleSeed ships a render → score → revise loop—not a prompt dump. Read BENCH-V1 and inspect the raw evidence →

Easy Start (30 seconds)

Our goal is repeatable application of expert judgment, not a claim of expert-level output today. The engine compiles selected rules, preserves project choices, and supports code and rendered checks. A score does not replace human design acceptance. Product principles · Quality-first roadmap

1. Open your project in Claude Code, Codex, Cursor, or another coding agent.

2. Paste this message:

Install StyleSeed with `npx skills add bitjaru/styleseed`, then set it up for this project. Help the agent repeat our design decisions, not replace our design system. First inspect approved tokens, components, and project choices; report unsupported choices instead of silently remapping them. Ask what I am building and only the unresolved decisions you need. Choose a supported output grammar, brand recipe, and semantic palette—or derive a local grammar from my references. For creative exploration use `/ss-studio` in Claude Code or `$ss-studio` in Codex and pause for my selection. Otherwise resolve the approved direction with `/ss-resolve` or `$ss-resolve`, implement, score to at least 80, and inspect the rendered result. Report evidence and remaining human decisions; do not treat a score as my approval.

3. Approve the install, answer the short setup questions, and describe what you want to build. The invoked workflow handles the design lock, build, code gate, and visual check. Bring existing design decisions when you have them; review proposed choices when you do not.

Agent	If you want to run it manually
Claude Code	/ss-studio for exploration, or /ss-setup → /ss-build for a decided screen
Codex	$ss-studio for exploration, or $ss-setup → $ss-build from /skills
Cursor and others	Paste the message above or use the installed skill picker

Claude Code guide · Codex guide · See examples · Need help?

Evaluating the repository?

Use the three-minute verification path to test a clean public install before trusting the README. The source-level evaluator quickstart then connects that install to the published release manifest, Windows PowerShell evidence, CI, SBOM, benchmark boundary, and production build.

Want a first PR? Fix a doc, add a regression fixture, improve a skin, or claim a good first issue. Small docs and test fixes need no proposal. See the 15-minute contribution path.

What the current rules check

StyleSeed ships 74 craft rules and a 0–100 scored gate that tells an installed agent to revise screens below 80 before presentation. Checks must be interpreted through the selected grammar and project contract, not as universal taste. The workflow must actually be invoked; a markdown file alone cannot block delivery, and 80 points is not expert approval.

Check	Why
Unselected default accent	require an intentional, recorded color role
Emoji as UI icons 🚗 🧺 ⭐	inject random colors, render differently per OS
The icon-in-a-chip above every feature card	gen-1 AI tell — decoration pretending to be information
All-even grid of same-weight centered cards	the #1 machine-composed tell: no focal point
Accidental flat-black backgrounds	use the selected grammar's surface model; explicit supported exceptions differ
Type sizes outside the selected scale	prevent unintentional hierarchy drift
Hardcoded hex in components	tokens only — otherwise the lock can't hold across screens

_{Banning the defaults isn't enough — agents converge on new uniforms once the old ones are blocked. That's why the rules come with an enforced score-then-fix loop, not a checklist. What happens after install ↓}

---

What happens after Easy Start

Why the prompt installs first: the context compiler and quality gates can only run when the skills are installed. Installing turns STYLESEED.md into a small source-hashed rule bundle, then actually scores and fixes the result before you see it. Without installation, llms.txt still tells any agent how StyleSeed is structured and where its machine-readable catalog lives, but compilation and gates become a weaker manual path. Works with Claude Code (CLAUDE.md), Codex / Amp / Gemini CLI (AGENTS.md), and Cursor (.cursorrules) — StyleSeed ships all three. (Planning first is what keeps the result from looking random — see Troubleshooting.)

What your agent actually does with StyleSeed loaded:

you    ▸  build me a billing settings page
agent  ▸  (plan mode) key color? for billing I'd go deep teal — #0F766E, mood: sharp · calm ·
          trustworthy (not the default indigo). Motion: Snap. ok?  ▸ y
agent  ▸  ✓ wrote STYLESEED.md — skin, accent, font, radius, motion locked for project-scoped visual work
agent  ▸  building… running the quality gate before I show you anything
gate   ▸  ✗ two accent colors   ✗ "normal" rows colored   ✗ no empty state   → fixing
agent  ▸  ✓ 88/100 — one accent, grey normal states, real empty/error states. here's the page.

The STYLESEED.md lock is the anti-drift mechanic. Your skin, key color, radius, and motion get written once. Installed project instructions and StyleSeed skills re-read it for visual work, so those decisions can survive new screens and sessions. When the build workflow runs, the Quality Gate reviews and fixes the UI (rainbow lists, two accents, missing states) before presentation — and it can retrofit an old generic build too.

The method stays open and portable. The sources are plain markdown; installation adds the deterministic context compiler, manifest, and executable gates. If installation is unavailable, llms.txt gives any agent the portable routing contract, but it cannot provide the same reproducible local compile by itself.

Want the 23 core agent skills too (the styleseed router plus 22 ss-* workflows for Studio, context resolution, setup, build, review, score, and verification)?

npx skills add bitjaru/styleseed

Installs all 23 canonical core workflow skills into Claude Code, Codex, Cursor, Gemini CLI, Amp and more. Then run /ss-setup → /ss-resolve in Claude Code or $ss-setup → $ss-resolve in Codex (you can also choose them from Codex's /skills picker). The resolver writes a targeted .styleseed/effective-rules.md bundle plus a source-hash manifest, so the agent does not need the 220KB full handbook for every task. Your agent may ask you to approve tools on first use. No install possible? Read llms.txt for the portable routing contract.

Your agent, its exact path:

Your agent	Reads	Fastest install
Claude Code	CLAUDE.md + /ss-* skills	npx skills add bitjaru/styleseed
Cursor	.cursorrules	cp engine/.cursorrules .cursorrules — or paste the prompt above
Codex	AGENTS.md + $ss-* skills (.agents/skills)	npx skills add bitjaru/styleseed
Amp · Gemini CLI	AGENTS.md + skills	npx skills add bitjaru/styleseed
Windsurf · Copilot · any other	the paste-prompt above	no install — paste & go

_{More paths (manual copy, Cursor, awesome-design-md brands) in Install by hand below.}

---

Who is this for?

• You asked Claude Code or Cursor to build a dashboard and it came out amateur-looking
• You're vibe coding a SaaS app and don't want to hire a designer
• You use shadcn/ui but the output still feels generic
• You want Toss-like consumer refinement only where that grammar fits, not on every output
• You make social carousels, decks, reports, covers, or other vibe-coded visual artifacts
• You have references and want their repeatable design language extracted instead of cloned
• You're building a Claude Code skill or Cursor rules setup for design
• You ship fast with AI and need professional UI that doesn't look AI-generated

Where StyleSeed fits among design-AI skills

There are lots of "help your AI design" projects now. Most solve a slice. StyleSeed is the one that targets the whole "looks AI-generated" problem — and enforces the fix.

	StyleSeed	Brand / DESIGN.md collections	"Make-it-prettier" skills	UI generators (Claude Design, v0…)
Teaches design judgment (how designers think)	✅	❌ data only	⚠️ a few tips	❌
Fights the AI-look itself — default indigo, icon-chip cliché, template layouts, rainbow lists	✅	❌	❌	❌
Scored Quality Gate — reviews + fixes the UI before you see it	✅	❌	❌	❌
Anti-drift design lock — decisions persist across sessions	✅	❌	❌	❌
Works across every agent (Claude Code · Cursor · Codex · Amp · Gemini)	✅	⚠️	⚠️	❌ one tool
Brand skins + named motion system	✅	⚠️ colors only	❌	⚠️
Free & MIT	✅	✅	usually	freemium

They're not all competitors — a DESIGN.md gives StyleSeed a skin; a generator gives it a first draft. StyleSeed is the judgment + enforcement layer the others don't have.

What it actually enforces (a taste)

The kind of specific, named calls a senior designer makes without thinking — written down so an AI applies them every time:

• The refined black is #2A2A2A, not #000 — a 5-step grayscale ramp, never pure black
• One accent, everything else greyscale — the single-accent law; a second hue is the fastest "un-designed" tell
• Numbers 2:1 with their unit — a 48px value over a 24px unit; equal sizes flatten magnitude into noise
• Nested-radius law: inner = outer − padding — concentric corners, so a card and its inner button agree
• Layered, low-opacity shadows (≤8%) lit from one direction — not one hard drop shadow
• Tabular numbers for anything that updates — no width jitter as values change
• Status color = severity only — a "normal" row is grey; color marks the exception, never a rainbow list
• No emoji icons, and no Lucide-in-a-pale-chip on every card (§CC-9b) — the two opposite AI icon tells
• 8px spatial grid; gap-around-a-group > gap-inside it — proximity that reads as structure
• Optical, not pixel, alignment — nudge arrows/play glyphs; center type by cap-height
• Desktop body ≥16px, one focal point per screen — the tight mobile scale and an all-even grid both read "machine-made"
• One radius personality · one icon set · one shadow language — the coherence laws (§C0), the #1 fix for "looks AI-generated"
• Motion scoped by surface — a dashboard stays calm; a landing page gets the Cinematic tier (scroll-linked reveals, 3D hero, animated gradients — the Stripe/Linear playbook). Scroll-jacking is still banned everywhere (§43)

See all 74 rules → · the craft & coherence laws →

Data vs Judgment

Tokens and components are necessary, but they do not explain every design decision. Agents also need to know when a pattern applies, why it fits the task, which choices are approved, and how to handle exceptions. Expert judgment and implementation material need to travel together.

StyleSeed's goal is to make that judgment repeatable while leaving intent, tradeoffs, and acceptance with people. The current engine is a starting point; component-context experiments and independent human evaluation are the next steps, not completed capabilities.

See the before/after → — the same dashboard brief, generated generically vs. with the 74 rules applied. Every fix annotated with the rule behind it.

StyleSeed is a design-method engine — 74 craft rules, 8 output grammars, 5 surface adapters, 48 components, a reference compiler, a named motion system, and 23 agent skills:

"Use the approved semantic roles rather than inventing component-local colors."
"Select grouping and density for the task, not for a favorite template."
"Preserve the project's type and surface system across screens."
"Loading, empty, error, and recovery states are part of the implementation."
"Record unsupported choices instead of silently changing the design system."

StyleSeed organizes maintained guidance by grammar, adapter, domain, and project choices, then compiles the selected context for the agent. Defaults are not universal expert decisions: unsupported project choices need an explicit review, not a silent palette or component swap.

See full page

    

Works with Claude Design

Claude Design generates UI fast — but it still picks #000 for text, reaches for six accent colors, and floats cards with no background separation. The missing piece isn't more templates. It's the 74 rules that tell the model when to use which pattern and why.

StyleSeed + Claude Design together:

1. Claude Design generates the layout and components (fast scaffolding)
2. StyleSeed's 74 rules refine the output (design judgment layer)
3. Brand skins make it look like your brand, not like "AI made this"

Drop DESIGN-LANGUAGE.md into your Claude Design workflow and the same model produces noticeably more refined output — without changing a single prompt.

"Why not just use the official frontend-design skill?"

Use both — they solve different halves of the problem. Anthropic's official frontend-design skill scaffolds a clean screen fast, and it's a great starting point. StyleSeed is the layer on top:

	Official frontend-design	StyleSeed
Gets you a coherent screen	✅	✅
Names & bans the generic-AI tells	—	✅ by name (default indigo, icon-chip, rainbow lists…)
Scored gate that fixes before you see it	—	✅ /ss-score loops to ≥80
Locks decisions so they don't drift across prompts	—	✅ STYLESEED.md
Presets + dials to move the whole look at once	—	✅ /ss-restyle, /ss-dial

Official gets you coherent. StyleSeed keeps you from looking templated. Run the official skill to scaffold, then let StyleSeed's gate refine and enforce.

Install by hand

The fastest path is at the top — paste one prompt, or run npx skills add bitjaru/styleseed. To wire StyleSeed into an existing project manually, use one of the options below.

New to this? Read top to bottom — every step matters. The most common mistake is expecting setup to work before the skill is installed. Claude Code scans .claude/skills/; Codex scans .agents/skills/. Windows users can follow the copy-pasteable PowerShell verification path. Reviewers can run the end-to-end evaluator quickstart.

Option 1: Interactive Setup (Recommended)

Step 1 — Install the skills. The portable path for every supported agent is:

npx skills add bitjaru/styleseed

For a manual project-local install, clone StyleSeed and copy the canonical skill folders into the path your agent scans:

git clone https://github.com/bitjaru/styleseed.git /tmp/styleseed

# Claude Code
mkdir -p .claude/skills
cp -r /tmp/styleseed/engine/.claude/skills/* .claude/skills/

# Codex (repository-scoped skills)
mkdir -p .agents/skills
cp -r /tmp/styleseed/engine/.claude/skills/* .agents/skills/

Step 2 — Start a fresh agent session, open your project, and invoke setup:

Claude Code: /ss-setup
Codex:       $ss-setup   # or open /skills and choose ss-setup

The wizard then walks you through:

1. Product job, surface, and output grammar
2. One of nine brand recipes for morphology (`enterprise-wor