by bitjaru
Open-source design-method engine for Claude Code, Codex & Cursor. Gives coding agents fixed design judgment—not one fixed aesthetic—then selects or derives the right grammar from references, locks project decisions, and verifies UI, carousels, decks & docs. 20 skills · MIT.
# Add to your Claude Code skills
git clone https://github.com/bitjaru/styleseedLast scanned: 5/27/2026
{
"issues": [],
"status": "PASSED",
"scannedAt": "2026-05-27T08:04:02.738Z",
"semgrepRan": false,
"npmAuditRan": true,
"pipAuditRan": true
}styleseed is an open-source ai agents skill for AI coding assistants such as Claude Code, Codex CLI, and ChatGPT, built by bitjaru. Open-source design-method engine for Claude Code, Codex & Cursor. Gives coding agents fixed design judgment—not one fixed aesthetic—then selects or derives the right grammar from references, locks project decisions, and verifies UI, carousels, decks & docs. 20 skills · MIT. It has 808 GitHub stars.
Yes. styleseed passed SkillsLLM's automated security scan — a dependency vulnerability audit plus prompt-injection heuristics — with no high-severity issues. You can read the full report in the Security Report section on this page.
Clone the repository with "git clone https://github.com/bitjaru/styleseed" and add it to your Claude Code skills directory (see the Installation section above).
styleseed is primarily written in TypeScript. It is open-source under bitjaru on GitHub, so you can review or fork the full source.
Yes. SkillsLLM lists many other AI Agents skills you can browse and compare side by side. Open the AI Agents category from the badge at the top of this page, or use the Related Skills and comparison links further down to weigh styleseed against similar tools.
No comments yet. Be the first to share your thoughts!
Open-source design-method engine for Claude Code · Codex · Cursor — selects the right design grammar or derives one from references, locks project decisions, and verifies the rendered result.
Same product. Same prompt. Only the rules changed.
The "AI-generated look" isn't bad luck — it's a list of nameable tells. StyleSeed ships 74 rules that ban them, and a 0–100 scored gate that blocks any screen under 80 from ever reaching you.
| Banned | Why |
|---|---|
Default indigo #4F46E5 / #5E6AD2 accent |
the universal "an AI made this" color |
| 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 |
Pure #000 backgrounds |
a flat void — real dark UIs use layered ramps |
| Font sizes outside one fixed table | size drift is why screens feel "off" but you can't say why |
| 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 ↓
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. Ask what I am building and only the design choices you need. Save approved decisions to STYLESEED.md, choose the right output grammar or derive one from my references, and build with one clear focal point. Score the result to at least 80, then render and visually verify it before showing me. Use `/ss-*` in Claude Code or `$ss-*` in Codex; in other agents, use the installed skill picker.
3. Approve the install, answer the short setup questions, and describe what you want to build. StyleSeed handles the design lock, build, code gate, and visual check. No design-system knowledge required.
| Agent | If you want to run it manually |
|---|---|
| Claude Code | /ss-setup → /ss-build |
| Codex | $ss-setup → $ss-build or choose them from /skills |
| Cursor and others | Paste the message above or use the installed skill picker |
Claude Code guide · Codex guide · See examples · Need help?
One component. Three brand DNAs. Same chat UI morphing across Toss · Raycast · Arc — colors, radius, motion, shadows, gradients all driven by StyleSeed tokens. Just a data-skin attribute.
Skins are inspired-by token sets — brand-flavored color/radius/shadow/motion values, not recreations of those companies' design languages. The layer that restructures the actual design is the presets (/ss-restyle, below).
StyleSeed fixes the design method — not one Toss-like aesthetic.
Judgment, not data — how designers think, not a palette collection ·
Right grammar for the result — consumer service, operations, technical, editorial,
commerce, institutional, marketing, or sequential story ·
References become rules — /ss-reference compiles screenshots, URLs, Figma, or an existing
UI into an evidence-backed project grammar ·
Beyond web UI — adapters for product UI, social carousels, decks, documents, and graphics ·
Fights the AI tells — the default indigo, the icon-chip cliché, template layouts, rainbow lists ·
Auxiliary proof gates — code score + rendered pixel verification before you see it ·
Every agent — ships CLAUDE.md + AGENTS.md + .cursorrules ·
A design lock that stops drift ·
Free & MIT
Core judgment × output grammar × surface adapter × domain/page × optional profile. Read the architecture →
Full pages: before · after · more before/afters →
🔥 We ran an early version of this page through our own gate. It scored 58/100 → here's the receipt
Same product, six looks — each one /ss-restyle <preset> away. Coherent, distinct, never generic.
Easy Start · Claude Code UI guide · Codex UI guide · Architecture · Engine + Skins · Motion · Skills · Wiki · 한국어
Why the prompt installs first: the quality gate is the step that makes output stop looking generic — but the ss-score and ss-build skills can only run if they are installed. Point an agent at the rules-URL alone and the "gate" degrades to an honor-system self-check it usually skips. Installing makes the loop real: the lock persists in STYLESEED.md (no drift), and the gate actually scores and fixes before you see anything. Can't install? The URL still teaches the rules — just weaker. 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, re-read every prompt
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 and the rules make every agent re-read and obey them on every prompt — so the design stops being different each session. The Quality Gate then self-reviews and fixes the UI (rainbow lists, two accents, missing states) before you ever see it — and it can retrofit an old generic build too.
The rules are the product — and they need zero install or permissions. They're plain markdown (
CLAUDE.md/AGENTS.md/DESIGN-LANGUAGE.md), so the prompt above — or just copying those files in — is 90% of StyleSeed with nothing to approve.
Want the 20 ss-* agent skills too (optional automation: grammar compiler, setup